This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Stylesheets > June 2004 > Centering images





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author Centering images
Abs

2004-06-26, 7:15 pm

Hi!

I'm having a little problem with my site. I know how to center DIVs
using the "margin: auto" thing. But I'm unable to center two images.
I used the "text-align: center" hack with no results, too.

Here is my site:

http://project.fotografist.com/


and the CSS:

http://project.fotografist.com/styles/styles_black.css


Basically, I need to center the images in the "photos" DIV.


Can someone help me, please ?


thanks in advance
Els

2004-06-26, 7:15 pm

Abs wrote:

> Hi!
>
> I'm having a little problem with my site. I know how to
> center DIVs
> using the "margin: auto" thing. But I'm unable to center
> two images. I used the "text-align: center" hack with no
> results, too.
>
> Here is my site:
>
> http://project.fotografist.com/
>
>
> and the CSS:
>
> http://project.fotografist.com/styles/styles_black.css
>
>
> Basically, I need to center the images in the "photos" DIV.
>
>
> Can someone help me, please ?


I'm not sure what it is you want: center them one below the
other? or next to each other?

You are using float:left on the div which surrounds the first
img, this will never get it centered. Float:left means left,
not centered.
Also you don't need to put divs around the img's, you can
apply the styles to the img elements themselves.

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Abs

2004-06-26, 7:15 pm

Els wrote:

>
> I'm not sure what it is you want: center them one below the
> other? or next to each other?


yes, one next to the other.

> You are using float:left on the div which surrounds the first
> img, this will never get it centered. Float:left means left,
> not centered.
> Also you don't need to put divs around the img's, you can
> apply the styles to the img elements themselves.
>


Ok, I'll try with no DIVs surrounding the images.
Abs

2004-06-26, 7:15 pm

Abs wrote:

> Els wrote:
>
>
>
> yes, one next to the other.
>
>
> Ok, I'll try with no DIVs surrounding the images.


Great, it works now. But I don't know if the text-align hack is the
right way to do it. Anyways...
Els

2004-06-26, 7:15 pm

Abs wrote:

> Abs wrote:
>
>
> Great, it works now. But I don't know if the text-align
> hack is the right way to do it. Anyways...


You must notice though, that in IE, if the window is narrower
than the width of the two pictures, it won't be centered
anymore. In Gecko browsers, it will remain centered, thus
'losing' the left side of the left picture, where no scrollbar
will go. In IE, the left border of the left picture will stop
when touching the left side of the window, while the column
will remain centered.

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Brian

2004-06-27, 7:16 pm

Abs wrote:

>
> I don't know if the text-align hack is the right way to do it.


IMG is inline by default, and text-align is for inline content, so it
is the right way to do it, and is not a "hack".

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews