On 9 April 2014 16:00, Freelance Traveller <edi...@freelancetraveller.com>wrote:
> First, is display: table-cell a viable solution for the layout issue? > caniuse suggests that if I don't feel a need to support IE7 or earlier, > I should be OK, but caniuse doesn't always tell the whole story. > The special 'taken out of flow' you're describing is a result of what Stubbornella calls a 'new formatting context'. display: table-cell is a gods-end for this purpose. Old IE actually had this all catered for with zoom: 1; – more here: http://www.stubbornella.org/content/2010/12/09/the-hacktastic-zoom-fix/ I've built dozens of sites using Stubbornella's OOCSS grids module which specifically uses display: table-cell with a zoom: 1; fallback to make the last element of a 'row' occupy the full remaining width. The OOCSS project is a bit of a mess these days (it never was as popular as it deserved, probably down to very poor visibility and maintenance) – it requires you to deploy virtual machines just to build the CSS (!) – but I currently use the following SCSS extension to achieve the desired effect: @mixin fill-remaining-width { display : table-cell; float : none; width : auto; *zoom : 1; &:after { clear: both; color: transparent; display: block; visibility: hidden; overflow: hidden; height: 0 !important; line-height: 0; font-size: xx-large; content: "x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x"; } } Regards, Barney Carroll barney.carr...@gmail.com +44 7429 177278 barneycarroll.com ______________________________________________________________________ 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/
