W3C home > Mailing lists > Public > www-style@w3.org > August 2014

Re: [css-flexbox]: How to force a wrap?

From: Henrik Andersson <henke@henke37.cjb.net>
Date: Fri, 01 Aug 2014 13:49:03 +0200
Message-ID: <53DB7EAF.5070403@henke37.cjb.net>
To: Axel Dahmen <brille1@hotmail.com>, www-style@w3.org
Axel Dahmen skriver:
> http://jsfiddle.net/XFq59/110/
>
> Hi,
>
> I'd like the buttons from the example above to be displayed three in a
> row
> while watching the page in landscape view, and two in a row when watching
> the page in portrait view:
>
>
> ---------------------------------------------------------------------
> |
> |              Button #1   Button #2   Button #3
> |              Button #4   Button #5   Button #6
> |
> ---------------------------------------------------------------------
>
>
> --------------------------------------
> |
> |
> |
> |     Button #1   Button #2
> |     Button #3   Button #4
> |     Button #5   Button #6
> |
> |
> |
> --------------------------------------
>
>
> So, no matter how much free padding space there is (or isn't), I want the
> design to be either 3*2 or 2*3 buttons.
>
> How can I achieve this? Is flexible box layout the right approach to
> achieve
> this?
>
> A table design approach wouldn't work, I assume, as it wouldn't be
> able to
> rearrange by @media rule.
>
> Your help is appreciated.
>
> Regards,
> Axel Dahmen
>
>
>
I would go for a grid layout using media selectors to change the number
of columns.
Received on Friday, 1 August 2014 11:49:39 UTC

This archive was generated by hypermail 2.3.1 : Friday, 1 August 2014 11:49:39 UTC