ThemeShaper Forums » Thematic

[closed]

Overflow: hidden problem in #main div

(6 posts)
  • Started 8 years ago by mran
  • Latest reply from sowingseeds
  • This topic is resolved
  1. Hi,

    I'm having a weird css issue. You can see it here: http://goudaform.sc34.info/calendar/ if you will click the tiny arrow that is beneath the entry for Sunday the 16th. (Not the link that says "first event;" that works fine.) The problem is that the box which pops up is clipped. The other item on the page, the one for the 17th appears correctly.

    My 2c-l-fixed.css has this:

    #main {
    width:940px;
    margin:0 auto;
    overflow:hidden;
    position:relative;
    }

    In my style.css, I have this:

    #main {

    background: #fff url(images/roots.gif) no-repeat right top;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
    }

    Apparently, the overflow is hidden, which is odd because I read that this declaration is not inherited, and the object in question is nested deeply in more divs and a table.

    Removing the declaration makes things even worse. The little pop-up div will show just fine...but the #main div's white background and its bg image (those root things) will disappear and the div will be the same green as the rest of the page.

    I've never seen this.

    Does anyone know how I can get the little popups to display correctly without losing my design elements?

    Thanks a bunch!

    Posted 8 years ago #
  2. The same issue seems to be cutting off my css menu. You can see under "Classes," I have a child page, but only half its drop-down appears.

    This must be something I messed up myself; no way would the original css be this buggy.

    Posted 8 years ago #
  3. it isn't odd, that is how it is supposed to be. the overflow 'hidden' on the #main div serves as sort of a 'frame' for all the content and super wide content isn't shown to not break any layout.

    you could set

    #main{
    overflow: visible;
    }

    then you'll probably have to move your white background and roots graphic to the #container div as the #main div doesn't wrap around the floated elements.

    ps- what calendar are you using? i am on the lookout for one.

    Posted 8 years ago #
  4. I'm using My-Calendar, a plug-in for WP. So far, I'm very happy with it; it's highly customizable and well-styled, and it's easy to edit almost any part of it to suit.

    Thank you for your thoughts. With some tweaking of the margins, it did fix my problem with the pop-up div display. My menu drop-down is still cut off. I wonder how I messed that up?

    I'll play with the z-indexes a bit more and see if I can fix it unless anyone else has any ideas.

    Appreciate the help!

    Posted 8 years ago #
  5. Ha! Wasn't me. The #access div is also set to overflow: hidden. Now that just makes no sense whatsoever. The theme is supposed to be set up to allow a drop-down menu, which is naturally going to have some overflow. I don't remember having this problem with Thematic before, though this is only the second time I've ever used it.

    Considering the variety of pop-up and drop-down things we like to stick in our designs, this seems like a very weird way to do things. I'm just sayin! Though in most other ways, I'm a great Thematic fan. If someone wants to explain to me why I'm wrong to think this way, I'll certainly be willing to stand corrected, however.

    Thanks again for your help, Helgatheviking. (Are you an SCA member, by chance? :)

    Posted 8 years ago #
  6. sowingseeds
    Member

    Maybe check that the z-index in #main has not caused the drop down to be 'hidden'.

    Posted 8 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.