The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Pushing one div down and the other one up

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #206784

    Hi there all,

    I really need help with this. Posted it on Stack Overflow (which is where you can find all the code associated with my problem) but no one seems to be able to help.

    Essentially, I have a “hamburger” mobile navigation button that when clicked brings up a div titled #navigation. However, due to where the div is positioned (it is in other divs) the div does not extend to 100% of the width of the document, just 100% of the width of the container div.

    Not only is this a problem but there is also a secondary issue because the navigation div also overlaps slightly with both the header div and the div below it. I’d rather it push the header up and the div below it down.

    Whilst I could take this div out of the container and possibly fix the problems by placing it elsewhere, that then causes problems with the navigation on the full size version of the page then as the #navigation div is the same for both versions of the page, just different styling.

    I had some advice that perhaps adding “position: relative” to #header and “position: absolute” to #navigation (plus using “top” to adjust its location) would solve the problem, but this doesn’t work too well either as it doesn’t push the divs below it down to account for the space the navigation takes up!

    Any help would be appreciated.

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.