Hi
We have a row of floating divs. When you hover over them, their respective dropdown menu shows. Perfect.
When it's down to a mobile width, the DIVs tile (so they don't take up too much vertical real-estate), but when you tap on them the 'dropdowns' go outside of the page width, causing the page to expand on a phone, and shrinking the page (to fit it all in the screen).
So my question is... is it possible to set the dropdown DIV to be full width of the screen, directly below it's parent DIV?
I have attached an example of what it is doing, and what I want it to do.
I'm using position: relative for each div and position: absolute for the dropdowns.
Using Floating Divs, and absolute position dropdowns issue
Moderator: General Moderators
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Using Floating Divs, and absolute position dropdowns issue
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Using Floating Divs, and absolute position dropdowns iss
Answered my own question yet again.
In the Dropdown DIV that is display: none, add this line:
left: 0px;
And set width to be 100%.
In the Dropdown DIV that is display: none, add this line:
left: 0px;
And set width to be 100%.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.