WilxCairo
WilxCairo

Reputation: 27

How to center an image in my web browser?

UPDATED.

I want to center an image in a webpage both horizontally and vertically. I tried using the following JQuery and I can't figure out what I'm doing wrong.

The webpage is here: http://aaa.sr

This is the JQuery I'm using: andreaslagerkvist.com/jquery/center/

I've put the js file here: aaa.sr/jquery.center.js

I'm new here so this website allows me to post only one link in my question. Any help is appreciated. Thanks!

Upvotes: 1

Views: 342

Answers (4)

Steve Adams
Steve Adams

Reputation: 2837

Something as simple as this would do the trick. I decided to leave my answer (The others are correct) not only to show a solution to your current problem, but also to suggest scrapping the paragraph tag (It isn't necessary) and to suggest adding an alt description to your image tag.

This css:

#container {text-align: center;}

And this html:

<div id="container"> 
 <img src="http://aaa.sr/aaasr.png" alt="Fil donya lazim tikabbar, Fil net mafeesh gheir aaa.sr">
</div>

Should be all you need for a website this simple.

Upvotes: 0

Josh Lee
Josh Lee

Reputation: 177530

Major problem:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://aaa.sr/jquery.center.js"></script>
<script type="text/javascript">
$('#my-element').plugIn();
</script>

    </body>

All of the spaces are actually non-breaking spaces, which causes parse errors. The HTML validator will detect this!

Upvotes: 1

Ethan Turkeltaub
Ethan Turkeltaub

Reputation: 2961

It would be easier to just use CSS.

p > img { margin: 0 auto }

Upvotes: 1

GolezTrol
GolezTrol

Reputation: 116100

Why use JQuery to center an image. There are load of methods to center an image, like putting it in a div with text-align:center or displaying it as a block and assigning auto left and right margins. This is just plain old CSS.

Upvotes: 1

Related Questions