Chris Akins wrote:
> Wondering what I'm not getting about a floated div (#art) that I have
> applied {text-align:center} to. It's centering the image inside,
> but not affecting the <p> content. I've tried putting the text-align
> on the <p> itself, still to no avail.
> http://www.springfieldmo.gov/community/artrain/
The image defaults to inline, so it gets centered by 'text-align: center'.
The _content_ of #art p is also centering just fine, but the p itself is
a block-element and won't be centered by 'text-align: center'.
The 'width: 80%' will then leave 20% unused space on the right side of
the p.
All is as it should be so far, but apparently not what you want.
Alt 1: the #art p {margin: 0 auto;} you've already tried, does center
the p itself - completely unaffected by 'text-align:xxxxx'. That's how
it should work.
Alt 2: you can add #art p {padding: 0 10%;} to make the p take up 100%
width with a 10% padding on each side. Will appear same as auto-margins.
Alt 3: #art p {display: inline-block;} will also work, but isn't
supported by all browsers. Makes the paragraph center like any other
inline element when subjected to 'text-align:center'.
regards
Georg
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
