Forums

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

Home › Forums › CSS › CSS horizontal nav

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • December 3, 2008 at 11:29 pm #23696
    nathan42100
    Member

    Hey, need some help here. Designing a website and integrating facebook into it. (http://tifty.tinr.org/index2.php)

    I want a layout like this
    [img]http://triton.imageshack.us/Himg243/scaled.php?server=243&filename=whatiwantpo9.png&xsize=578&ysize=480[/img]

    However, I can’t get the navigation bar the way I want it. I tried floats but they don’t seem to want to work :x

    Here is my code as of right now (html) but can be changed in anyway

    Code:
    …

    …

    December 4, 2008 at 2:06 am #51807
    humanboy
    Member

    Try putting links b in a span tag instead of a div tag.

    December 4, 2008 at 2:49 am #51808
    iopet
    Member

    Find:

    Code:

    Replace with:

    Code:

    Find:

    Code:
    #menubar
    {
    font-size: 10pt;
    display: block;
    background: #809FFF;
    margin-bottom: 5px;
    padding-right: 5px;
    padding-left: 5px;
    }

    #menubar2
    {
    font-size: 10pt;
    display: inline;
    float:right;
    background: #809FFF;
    margin-bottom: 5px;
    padding-right: 5px;
    padding-left: 5px;
    }

    #menubar a
    {
    color: white;
    display: compact;
    list-style: none;
    text-decoration: none;
    }

    #menubar a:hover
    {
    background: #CCCCFF;
    }

    Replace with:

    Code:
    #menubar {
    background: #809fff;
    margin-bottom: 5px;
    padding: 0 5px;
    font-size: 10pt;
    text-transform: uppercase;
    }

    #menubar2 {
    float: right;
    }

    #menubar a {
    color: #fff;
    text-decoration: none;
    }

    #menubar a:hover {
    background: #ccf;
    }

    December 4, 2008 at 4:02 pm #51830
    nathan42100
    Member

    Thanks iopet. The clear:both did it.

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