SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Guru Todd Temple's Avatar
    Join Date
    Mar 2005
    Location
    Tennessee
    Posts
    797
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Dropdown Issue

    LINK-
    http://www.securehostserver.info/gkent/

    I am trying to add a dropdown to the page linked above. The nested unordered list is included under the "Services" button in the main navigation at the top of the page. I cannot get the dropdown to appear. Can someone help me?

    Todd
    Todd Temple > T2 Design

  2. #2
    SitePoint Member RonnanR's Avatar
    Join Date
    Aug 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    In element div#header you have to change overflow to "visible".
    The "clearfix" class sets it as "hidden".

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    You seem to have corrupted (mixed) the clearfix method

    You should not have this:

    Code:
    .clearfix{overflow:hidden}
    That will effectively negate the reason for this:

    Code:
    .clearfix:after {
        clear: both;
        content: ".";
        display: block;
        height: 0;
        visibility: hidden;
    }
    If you are using the former then there is no need for the latter (and vice versa).

    There is actually no need for either of those in your header anyway because you have set the height explicitly.

    Besides, the above won't work in IE6 because it needs haslayout instead.

  4. #4
    SitePoint Guru Todd Temple's Avatar
    Join Date
    Mar 2005
    Location
    Tennessee
    Posts
    797
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    There is actually no need for either of those in your header anyway because you have set the height explicitly.
    So, I would simply remove the overflow:hidden from the clearfix class?
    Also, can you tell me why the footer-container does not stretch to 100% of the width of the iPhone browser? It has a nasty white gap instead of touching the edges...
    Todd Temple > T2 Design

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by Todd Temple View Post
    So, I would simply remove the overflow:hidden from the clearfix class?
    You either use the correct clearfix or us use overflow:hidden (+haslayout) instead except when you want visible overflow. If you are using overflow:hidden then you don't need to add an extra class for it. Just apply the rule natively to the element. (There is a thread about clearfix currently being discussed a few threads down from this.)

    Also, can you tell me why the footer-container does not stretch to 100% of the width of the iPhone browser? It has a nasty white gap instead of touching the edges...
    Your page has a min-width of 1144px so the white space is the scroll region to the edge of the browser from your 1000px footer.

    Add this:

    Code:
    #footer-container{min-width:1144px}


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •