Forums

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

Home Forums CSS IE pushes the menu bar down the page a bit.

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #24548
    CharlieK
    Member

    Hi. New guy, here.

    I created a site based on tutorials #25-27. It looks good, but when you view it in IE, the horizontal navigation bar gets pushed down below my nav bar background graphic. Since the text is white, you can now only see the menu by hovering over it.

    I’m thinking this has to do with some IE conditional coding I need to include, but I don’t know where to begin.

    Any help would be appreciated. Thank you.

    Here is the .css style for my the menu bar:

    #menu-bar { padding-top: 0px; margin-bottom: 10px; }
    ul#main-nav { width: 600px; float: left; margin: 1px 0 0 10px; }
    ul#main-nav li { display: inline; }
    ul#main-nav li a { text-transform: uppercase; color: white; font-size:
    1.4em; font-weight: bold; padding: 8px 15px;
    -moz-border-radius: 5px; -webkit-border-radius:
    5px;}
    ul#main-nav li a:hover { background: black; color: #FFFFFF; }
    form#searchform { margin: 0px 10px 20px 60px; display: inline; }

    http://www.opexcellence.com

    #56062
    apostrophe
    Participant

    Add this to your CSS

    Code:
    ul#main-nav li {
    display:inline;
    float:left;
    }

    and move your <div class="clear" /> after the menu bar div.

    #56152
    CharlieK
    Member

    Thanks for the help, apostrophe! I appreciate it.

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