> I have the following style in my CSS:
>
> body {
> margin: 0;
> padding: 0;
> border: 0;
> }
> #ad {
> width: 275px;
> height: 275px;
> margin-top: 0;
> margin-bottom: auto;
> border: 5px black double;
> background-color: red;
> text-align: center;
> vertical-align: middle;
> font-family: Arial, Helvetica, sans-serif;
> font-size: 275%;
> font-weight: bolder;
> color: blue;
> }
>
> The basic html is:
>
> <div id="ad">
> Our business is tax.
> </div>
>
> Now if I view this in browsers (IE8, FF 3.6.3), the text isn't
> vertically aligned. However, if I put the text within tags (like:
> <p>Our business is tax.</p> the text appears to be vertically aligned.
> Changing the font size to 100% again does not align. What is the trick
> here to get the text horizontally as well as vertically to be aligned?
You could add the following to your #ad rule:
display:table-cell;
vertical-align:middle;
but it won't work in IE6/7
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
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/
