Good point. However, CSS 1 still does not appear to make allowance for
vertical centering, and neither does Mozilla. I'm still reading through
CSS 2, but as its' spec is quite different I'm as yet unclear.
For example, in the following code example...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>Centering Using Margins In CSS 1</title>
</head>
<body style="width: 100%; height: 100%; background-color: blue; margin:
0;">
<div style="background-color: red; width: 100px; height: 100px; margin:
auto;">
</div>
</body>
</html>
...the block div element is horizontally centered, but not vertically.
In article <[EMAIL PROTECTED]>,
ValerieGSharp <[EMAIL PROTECTED]> wrote:
> GJK wrote:
>
> > I finally understand the mechanics behind horizontal centering using
> > CSS1 in Mozilla by applying the appropriate values to margin-left and
> > margin-right. Checking through the CSS1 spec, there's no mention of
> > vertical centering anywhere. Am I just missing something, or does
> > CSS1 completely miss vertical centering? Is there currently any
> > valid method for vertical centering in Mozilla?
> >
> > (No invalid code or frames!)
>
>
> Thing to remember is that the properties are with respect to the
> containing block. And while the initial containing block takes the width
> of the viewport, the height expands to fit the content.
>
> So centering vertically will have no effect unless you explicitly make
> the containing block larger than the content, e.g. explicitly make it
> the height of the viewport, before trying to center an element
> vertically.
