PDA

View Full Version : Centre A Few Images..?! Help


djshongo
05-06-2009, 07:32 PM
Hi,

I have a page set up, and i will eventually have about 20 images in this page, i would like to control them all using CSS. So far i only have 3 images on the page, using LightBox also.

So far i have this.

img.b {
border: 4px double #65503D;
}


Which simply adds a double lined border to them all, however, i would also like to centre them, any ideas how i do this?

Here is my HTML, if that helps :)

<div class="main_content" id="main_content">

<h2>Gallery</h2>

<a href="images/original pics WEB/imswanne morroco.jpg" rel="lightbox[keith]" title="keith in Morrocco"><img class="b" img src="images/original pics THUMBNAIL/imswanne morroco.jpg" ></a>

<a href="images/original pics WEB/strand pic.jpg" rel="lightbox[keith]" title="keith in strand"><img class="b" img src="images/original pics THUMBNAIL/strand pic.jpg" ></a>

<a href="images/original pics WEB/tinted.jpg" rel="lightbox[keith]" title="keith in studio"><img class="b" img src="images/original pics THUMBNAIL/tinted.jpg" ></a>

</div>

Thanks in advance!
:)

Corrosive
05-06-2009, 09:03 PM
Hi,

I have a page set up, and i will eventually have about 20 images in this page, i would like to control them all using CSS. So far i only have 3 images on the page, using LightBox also.

So far i have this.

img.b {
border: 4px double #65503D;
}


Which simply adds a double lined border to them all, however, i would also like to centre them, any ideas how i do this?

Here is my HTML, if that helps :)

<div class="main_content" id="main_content">

<h2>Gallery</h2>

<a href="images/original pics WEB/imswanne morroco.jpg" rel="lightbox[keith]" title="keith in Morrocco"><img class="b" img src="images/original pics THUMBNAIL/imswanne morroco.jpg" ></a>

<a href="images/original pics WEB/strand pic.jpg" rel="lightbox[keith]" title="keith in strand"><img class="b" img src="images/original pics THUMBNAIL/strand pic.jpg" ></a>

<a href="images/original pics WEB/tinted.jpg" rel="lightbox[keith]" title="keith in studio"><img class="b" img src="images/original pics THUMBNAIL/tinted.jpg" ></a>

</div>

Thanks in advance!
:)

Have you tried adding text-align: centre; in your main_content CSS? Btw, you've called your div as an id and a class of the same name. Which is it?

DWcourse
05-06-2009, 10:17 PM
couldn't you set the b class to margins: auto ?