Any reason why you can't change your CSS to
#left, #middle, #right {text-align: center;}
Then everything is centered to it's respective container div.
otherwise to shift left and right to the outside edges, you have to go to
nested divs such as:
<div id="left" class="span-8">
<div class="inner"><img src="images/one.jpg">
<p>caption text1</p></div>
</div>
<div id="middle" class="span-8">
<div class="inner"><img src="images/two.jpg">
<p>caption text2</p></div>
</div>
<div id="right" class="span-8 last">
<div class="inner"><img src="images/three.jpg">
<p>caption text3</p></div>
</div>
<div class="clearfix"></div>
#left .inner{float: left; text-align: center}
#middle .inner{text-align: center}
#right .inner{float: right; text-align: center}
----- Original Message -----
From: "cjl" <[email protected]>
To: "Blueprint CSS" <[email protected]>
Sent: Tuesday, September 01, 2009 1:57 PM
Subject: [BP #3311] Centering text under an image
>
> I'm messing around with Blueprint, and so far so good.
>
> I have three images, all the same size, 185px in width and 300px in
> height. I want one to the left, one centered, and one to the right. I
> have the following code, which works:
>
> <div id="left" class="span-8">
> <img src="images/one.jpg">
> </div>
>
> <div id="middle" class="span-8">
> <img src="images/two.jpg">
> </div>
>
> <div id="right" class="span-8 last">
> <img src="images/three.jpg">
> </div>
>
>
> The relevant css:
>
> #left { text-align: left;}
>
> #middle { text-align: center;}
>
> #right { text-align: right;}
>
>
> OK, this works. My three images are evenly spaced across the page.
> Now, I want to have a snippet of text under each image, centered on
> the image above, and cannot for the life of me get anything reasonable
> to work.
>
> Help?
>
>
--------------------------------------------------------------------------------
No virus found in this incoming message.
Checked by AVG - www.avg.com
Version: 8.5.409 / Virus Database: 270.13.74/2339 - Release Date: 09/01/09
06:52:00
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Blueprint CSS" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/blueprintcss?hl=en
-~----------~----~----~----~------~----~------~--~---
