I see, I did type "margin: 0 auto" in the email. David pointed this out,
but when I checked I **only** checked the pen, I didn't go back in the
email to double check. It should be:
.centeredElement {
position: absolute;
margin: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
height: 300px;
width: 300px;
}
On Tue, Oct 1, 2013 at 1:29 PM, MiB <digital.disc...@gmail.com> wrote:
>
> 1 okt 2013 15.10 Chris Rockwell:
>
> > If absolute positioning is an option, a simple, clean way is:
> >
> > .centeredElement {
> > position: absolute;
> > margin: 0 auto;
> > left: 0;
> > right: 0;
> > top: 0;
> > bottom: 0;
> > height: 300px;
> > width: 300px;
> > }
>
>
> Ok, so now I tried this with only the rules above and only one element in
> a HTML5 document, a div with the class "centeredElement" and it's not
> working in Firefox 23 either. The div is simply rendered at the top of the
> page at 0 position and goes exactly 300px down. Perhaps not very surprising.
>
> A similar technique that does work is to replace with these rules:
>
> margin-top:-150px;
> top: 50%;
>
> which works fine if the height isn't unknown. Usually height of an element
> isn't known so this is still of limited value.
>
> Clearly you left out something in your first post as your online example
> does seem to center vertically in Firefox. Please analyze this example of
> yours and repost what you think is the real solution.
> ______________________________________________________________________
> css-discuss [css-d@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/
>
--
Chris Rockwell
______________________________________________________________________
css-discuss [css-d@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/
