Page 1 of 1

CSS Table Footer Group causing min width block

Posted: Sun Feb 22, 2015 4:35 am
by simonmlewis

Code: Select all

display: table-footer-group;
I have a site where in the top DIV are two DIVs.

the logo one is on the left, and a box with a background image is on the right.

I've laid it out in CSS with Float left and Float right.
But on mobile, I want the "float right" one to cover after the logo (no float!). So the logo is on top of the "right" DIV.

So I did it with the css shown above, and display: table-header-group; for the logo div.

However, it's cause both these divs to block up ot a fixed width, rather than full width.

I have tried width: 100%, but that doesn't work. So how can I use this style, keeping the logo on the left, the other div on the right for desktop, while having the logo on top of the right div on mobile?

Re: CSS Table Footer Group causing min width block

Posted: Mon Feb 23, 2015 8:31 am
by Celauran
You haven't really posted enough for us to see what's going on, but couldn't you just change the CSS rules in your media queries?

Re: CSS Table Footer Group causing min width block

Posted: Mon Feb 23, 2015 9:18 am
by simonmlewis
Well I'm only really asking because it seems that assigning that to a class, sets the box to a "block" width rather than the standard 100%, unless otherwise set.