HJ

I was wondering how you would center align a img using css ❓

Thanks in advance

-Hayden

add a comment
0

9 Answers

  • Votes
  • Oldest
  • Latest
TY

Are you talking vertical or horizontal?

If you want to center it the way the <center> tag did

add this to your css element

.element {
      text-align:center;
}

if on the other hand you are wanting to have it in the middle of the screen vertically, thats a bit more tricky. You will need to play with the padding and margins to get it to do right. and that wont neccessarily solve it in all browsers

add a comment
0
HJ

that works perfect, thanks

add a comment
0
HJ

wow, false alarm the picture wasnt working

Here let me show you what im working with:
This pageis the actual page i am working with

This is my style sheet.
The class of the picture is car

add a comment
0
MS

I'm getting server errors in both places. Put text-align: center for the element containing the image, and that should be correct. In being rendered by a browser, an image is more or less equivalent to a single character, except that it has a different size than most characters, line breaking behavior is a bit different around images than characters, and the browser's bugs might be different.

text-align affects the alignment of the text contained by an element, not the alignment of an element itself.

add a comment
0
TY

OK so I played around a bit and noticed you didnt have a div at all. So I did this. I also killed somee of your code Ill paste from img.car down

img.car {
height: 400;
}
#main {
width:100%;
text-align:center;
}

And I added the content of your source inside a div

<body class=sub>
<div id ="main">
<img src=http://www.freewebs.com/waisanen14/Picscarcrash/car.jpg class="car">
</div>
<!-- --><script type="text/javascript" src="/i.js"></script></body>

It centers it for me.

add a comment
0
HJ

hmm weird, i kindve went off yours, but I just used a div instead of a span and an id instead of a class and it worked perfect.

Thanks all

add a comment
0
TY

hmm weird, i kindve went off yours, but I just used a div instead of a span and an id instead of a class and it worked perfect.

Thanks all

What do you mean? What I gave you was a div with an id I didnt have any span nor class.

add a comment
0
HJ

excuse me, I used a div instead of a span, and a id instead of a class. Just had a brain fart.

add a comment
0
TP

why dont u just put it inside:
div.pictureArea{position:relative; margin-left:auto; margin-right:auto;}

So, then it would center WHEREVER you put it. and you also wouldnt have to worry about heights.

add a comment
0