1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

I need CSS help - easy

Discussion in 'Web Design, HTML And CSS' started by Horath, Jan 21, 2009.

  1. Horath

    Horath New Member

    Joined:
    Jan 20, 2009
    Messages:
    1
    Likes Received:
    0
    Trophy Points:
    0
    I have a CSS document, and I want a thin colored bar on the side. This is my code:

    div#trans1 { background:#080000;
    width: 7px;
    height: 100%;
    position: relative;
    top: 0px;
    left: 0px;
    }

    The w3c CSS validator said it was good, and it works perfectly in Internet explorer.


    But it doesn't work in Firefox, Netscape, or Opera. I see a bar w/ the correct width, and color, but it is not 100% the screen size.

    ASAP help would be appreciated, so please reply soon if you have an answer for me!

    Once again, many thanks!
     
  2. shabbir

    shabbir Administrator Staff Member

    Joined:
    Jul 12, 2004
    Messages:
    15,283
    Likes Received:
    364
    Trophy Points:
    83
    Moved to CSS forum for better response.
     
  3. nInE-tAIls

    nInE-tAIls New Member

    Joined:
    Jan 21, 2009
    Messages:
    2
    Likes Received:
    0
    Trophy Points:
    0
    can you give me a screen shot of your work? may be I can help you.
     
  4. skp819

    skp819 New Member

    Joined:
    Dec 8, 2008
    Messages:
    89
    Likes Received:
    3
    Trophy Points:
    0
    Hope your asking for that.
    Code:
    body {
        behavior: url(csshover.htc);
        font-size:11px;
        font-family:Arial, Helvetica, sans-serif;
    }
     
    p a {
        color:     #000;
        text-decoration:underline!important;
    
    }
    a{
        color:    #000;
        text-decoration:none;
        }
    p a:hover{    text-decoration: none!important;
    }
    
    ul#nav {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    
    
    ul#nav li a {
        display: block;
        font-weight: bold;
        padding: 2px 10px;
        background:    #A52A2A;
    }
    
    ul#nav li a:hover{
        background:#888;
        color:#fff;
        }
        
    li {
        float: left;
        position: relative;
        width: 100px;
        text-align: center;
        margin-right:5px;
        border:1px solid #ccc;
    
    }
    
    ul#nav li.current a{
        background:    #A52A2A;
        }
    
    ul#nav li.current a:hover{
        background:    #A52A2A;
        }
    
    li ul {
        display: none;
        position:absolute;
        width:100px;
        top: 18px;
        left: 0;
        font-weight: normal;
        padding: 1px 0 10px 0;
        margin-left:-1px;
    }
    
    ul#nav li ul.sub li{
        border-width:0 1px 1px 1px!important;
    }
    
    ul#nav li ul.sub li a{
        font-weight: normal!important;    
    }
    li>ul {
        top: auto;
        left: auto;
    }
    
    li:hover ul, li.over ul {
        display: block;
    }
    
    </style>
    
    
     
    shabbir likes this.

Share This Page