SitePoint Sponsor

User Tag List

Results 1 to 8 of 8

Threaded View

  1. #1
    SitePoint Addict Romuba's Avatar
    Join Date
    Jun 2007
    Cape Town, South Africa
    0 Post(s)
    0 Thread(s)

    Nav button showing differently in Browsers

    I have set up some navigation buttons use CSS but when I check in the various browsers they display very differently and I can't fathom why. Everyone loves Firefox but for me it is a pain in this instance.

    This is the CSS I have coded:

    #leftside ul.topics {
    list-style: none;
    color: #ffffff;
    text-decoration: none;
    margin-left: 10px;
    margin-right: 10px;
    line-height: 40px;
    width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    #leftside ul.topics li {
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background: url(../images/nav_buttons_1.gif) no-repeat;
    text-align: left;
    display: block;
    color: #FFFFFF;
    text-decoration: none;
    padding-left: 15px;
    padding-top: 0px;
    #leftside ul.topics li a:link {
    color: #ffffff;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-decoration: none;
    display: block;
    margin-top: 5px;
    #leftside ul.topics li a:visited {
    color: #C0DCC0;
    text-decoration: none;
    #leftside ul.topics li a:active {
    color: #000000;
    text-decoration: none;
    background: url(../images/nav_buttons_1_active.gif) no-repeat;
    display: block;
    #leftside ul.topics li a:hover {
    font-size: 100%;
    color: #FFFF00;
    text-decoration: none;

    I have attached pics of what I have. First is what it looks like in Dreamweaver, then in IE7, then Firefox, then Firefox with text enlarged and lastly Netscape.
    Attached Images Attached Images
    Ross Bartholomew
    Web Designer/Developer


Posting Permissions

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