treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Tabs

  • I FIXED IT


    Hi,
    I am trying to make a tabs,

    http://img370.imageshack.us/img370/1980/tabshe1.jpg

    As you see i want to make Home About Contact and Settings in much bigger box and down,
    Settings I need at the right side.
    And how I write the code for the selected like here:
    <li><a class="selected" href="#Home">Home</a></li>
    .select {}
    ??
    Please Help Me,

    This is the code:
    <!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
    <html>
    <head>
    <style type=\"text/css\">
    { margin: 0; padding: 0; }
    body {margin:0;font: 62.5% Helvetica, Arial, sans-serif;}
    div#Header {background-color:#1A1613;
    height:150px;
    color:white;
    padding: 15px;}
    div#title {font-family:Helvetica;
    letter-spacing:-5px;
    font-size:8.2em;
    font-weight:bold;}

    .tabs {list-style:none;
    float:left;
    color:white;
    font-size:1.2em;
    }

    .tabs li {display:inline;color:black;background-color:white;}
    .tabs li a {color:black;background-color:white;text-decoration:none;}
    </style>
    <title>&raquo; Tabs</title>
    </head>
    <body>
    <div id=\"Header\">
    <h1>Dashboard</h1>
    <ul class=\"tabs\">
    <li><a class=\"selected\" href=\"#Home\">Home</a></li>
    <li><a href=\"#About\">About</a></li>
    <li><a href=\"#Contact\">Contact</a></li>
    <li class=\"setting\"><a href=\"#settings\">Settings...</a></li>
    </ul>
    </div>
    </body>
    </html>