?
Solved

page content and responsive menu

Posted on 2013-05-15
1
Medium Priority
?
434 Views
Last Modified: 2013-05-18
I've trying to adapt a menu I've found on this site:

http://osvaldas.info/drop-down-navigation-responsive-and-touch-friendly

if the page width is under 62.5em i don't want the page content to be obscured by the menu (even when expanded) ie. i want the page content to drop down beneath the menu even when its expanded.
if the page width is over 62.5em it doesn't matter if the menu covers the content.

I've created a jsfiddle to demo my progress so far:
http://jsfiddle.net/tonmachine100/T92UQ/

the menus on this site demo how i want the page content to drop down if the screen width is narrow:
http://sheepy.me/

what changes would i need to make to the css to achive this effect?
any help is appreciated.
0
Comment
Question by:tonMachine100
1 Comment
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 39168886
Remove position:absolute from your #nav > ul under your media query for that screen size.
0

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Suggested Courses
Course of the Month15 days, 12 hours left to enroll

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question