W3C home > Mailing lists > Public > www-style@w3.org > June 2008

Re: Publishing the flexible box model

From: Alan Gresley <alan@css-class.com>
Date: Tue, 10 Jun 2008 19:35:26 +1000
Message-ID: <484E4ADE.4060101@css-class.com>
To: Andrew Fedoniouk <news@terrainformatica.com>
CC: robert@ocallahan.org, fantasai <fantasai.lists@inkedblade.net>, Anne van Kesteren <annevk@opera.com>, dbaron@dbaron.org, www-style@w3.org

Andrew Fedoniouk wrote:
> 
> Robert O'Callahan wrote:
[...]
>> How do flexunits interact with absolute positioning and auto top/left? 
>> Is the hypothetical position for the content computed taking flexunit 
>> margins/padding on the content into account?
> 
> Yes.
> 
> Here is a screenshot if you wish:
> http://terrainformatica.com/htmlayout/images/css-menus.png
> 
> And here its style system:
> 
> /* top level menu band */
>     menu
>     {
>       flow:horizontal;  /* top level menu is a horizontal bar */
>       width:max-intrinsic;
>       padding-right:1*; /* spring on the right - all items sticked
>                            to the left */
>     }
> 
>     menu li
>     {
>       display: block;    /* menu items are blocks*/
>       position:relative; /* to make our popup relative to this one */
>       height:1*;         /* all items in the menu bar have the same
>                             height */
>       padding:2px 4px;
>     }
> 
>     menu li:hover
>     {
>       background-color:navy;
>       color:white;
>     }
> 
>     menu menu
>     {
>       flow: vertical;     /* popup menus are vertically replaced */
>       min-width:100%;     /* at least it is caption wide */
>       position:absolute;  /* out of normal flow */
>       display:none;       /* non-visible normally */
>     }
> 
>     menu > li:hover > menu
>     {
>       display: block; /* now it is visible */
>     }


Andrew, this I have done without flex.


http://css-class.com/articles/ursidae/bears3.htm


When I bump the text up in all implementations the whole menus system 
grows until it flows out of the viewpoint. Flex used this way breaks 
basic accessibility principles. How can this work with a monitor with a 
screen resolution of 800 by 600 pixels?


Alan
Received on Tuesday, 10 June 2008 09:36:27 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:55:07 GMT