WordPress.org

Ready to get started?Download WordPress

Forums

Need horizontal nav bar at the top (9 posts)

  1. goldie9
    Member
    Posted 9 years ago #

    I'm using WP1.5 and have the Kubrick default as the theme but I want to know how to place the horizontal nav bar at the top, like the one on binarybonsai or Mallow Theme. I read the instructions, and I copied the source code that applies to the navbar, but something must be missing because it doesn't display like that, you can see what I mean here http://www.your-data-recovery-directory.com . The buttons are there but not the way I want them. Also the 2 bottom links, don't go where they should , they bounce back to the main page, what would cause that?

    Can someone help me with this please?

    Thanks,

    Debbie

  2. Mark (podz)
    Support Maven
    Posted 9 years ago #

    I can't see any CSS for the list.

    When you do get some css, either give it a margin-top of 0px or position it before the header and move the header.

  3. goldie9
    Member
    Posted 9 years ago #

    Where do I get the CSS that's used to display the nav bar the way it is at
    http://binarybonsai.com/kubrick.php ? I've copied the nicetitle.css and JS and have all that uploaded but it doesn't seem to be having any effect.

    Thanks,

    debbie

  4. Nick Momrik
    Member
    Posted 9 years ago #

    You can get it in his CSS file.

    I believe it's the parts for #supernav

  5. goldie9
    Member
    Posted 9 years ago #

    I've already copied it just like he had and just replaced his links with mine,so there's got to be something else missing?

  6. Nick Momrik
    Member
    Posted 9 years ago #

    You copied the CSS or the HTML...or both?

    You need both.

  7. Rob Poitras
    Member
    Posted 9 years ago #

    this is the css you need to put into your css file for the specific theme

    /* Begin Navigation */
    #supernav {
    font: bold 9px/9px Verdana, Lucida Grande, Arial, Helvetica, Sans-Serif;
    position: absolute;
    top: 199px;
    left: 50%;
    width: 720px;
    margin: 0 0 0 -360px;
    padding: 0 25px;
    text-align: left;
    display: block;
    }

    #supernav li {
    display: inline;
    margin: 0;
    padding: 0;
    text-transform: lowercase;
    }

    #supernav a {
    color: #333;
    background: #B5DAE7;
    font-weight: normal;
    height: 19px;
    padding: 5px 16px;
    margin: 0;
    }

    #supernav a:hover {
    color: white;
    background: #f36;
    text-decoration: none;
    }

    body#blog a#blognav, body#archives a#archivesnav, body#about a#aboutnav, body#kubrick a#kubricknav, body#feeds a#feedsnav, body#photos a#photosnav {
    color: #111;
    background: white;
    border-color: white;
    }

    #hack {
    /* This is a really ugly hack to deal with a font rendering
    difference on Windows / OS X. I just needed a quick solution. */
    background: white;
    height: 1px;
    width: 500px;
    display: inline;
    position: absolute;
    top: 214px;
    left: 50%;
    margin: 0 0 0 -350px;
    padding: 0;
    z-index: 2;
    }
    /* End Navigation */

  8. goldie9
    Member
    Posted 9 years ago #

    Thanks, got it now! : )

    Debbie

  9. benhourigan
    Member
    Posted 9 years ago #

    I cut and pasted the CSS and supernav code from binarybonsai.com, and the tabs appear, but I can't get the one for the active page to come forward (i.e., turn white).

    I gather the part of the CSS that makes this happen is this

    body#blog a#blognav, body#archives a#archivesnav, body#about a#aboutnav, body#kubrick a#kubricknav, body#feeds a#feedsnav, body#photos a#photosnav {
    color: #111;
    background: white;
    border-color: white;
    }

    but I don't understand how it works. Can someone check out my site and tell me what I need to do?

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags