Forums

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

Home Forums CSS Overflow Problems

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #41603
    siouxfan45
    Participant

    My #container div sets a 15px margin on the top and bottom. Unfortunately, the bottom margin does not seem to be working unless overflow:hidden is set. [Check the sidebar on the homepage for an example](http://themeforward.com/demo2/ “”).

    I can’t set overflow:hidden on #container because the sub-menu will be hidden under the footer on shorter pages. For example at [http://themeforward.com/demo2/?page_id=1846](http://themeforward.com/demo2/?page_id=1846 “”) when I set overflow:hidden on container the sub-menu under ‘Categories’ becomes hidden.

    My current CSS

    #container {
    max-width: 960px;
    margin: 15px auto
    }

    #119026
    David_Leitch
    Participant

    Because you’ve floated your sidebar, the container is only growing to the height of main content. You just need to add a [clearfix](https://css-tricks.com/snippets/css/clear-fix/https://css-tricks.com/snippets/css/clear-fix/”) to the container element and the container will grow to the height of the sidebar and the margin-bottom will be applied.

    #119027
    Senff
    Participant

    The sidebar is breaking out of the container because it’s not cleared. You’ll need to use a clearfix on the container — setting “overflow:hidden;” on it would be one way but since you can’t use that, you’ll need another way (having said that though, I didn’t see any problems with the submenu even when the container DOES have overflow:hidden;).

    Try adding the following code in your CSS and then add a class “clearfix” to your container.

    .clearfix:before, .clearfix:after {
    content: ” “;
    display:table;
    }

    .clearfix:after {
    clear:both;
    }

    #119030
    Senff
    Participant

    Looks like you (still) haven’t applied the class “clearfix” to #container, so it’s hard for us to check why it’s not working then.

    #119035
    Senff
    Participant

    No clearfix class anywhere in that one either.

    #119042
    Senff
    Participant

    You don’t need to add another DIV at all, you really just need to add the class “clearfix” to the existing container div and make sure the code that I posted above is somewhere in your CSS file.

    #119051
    Senff
    Participant

    Nope, don’t think it should.

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