WEB css code help

Discussion in 'OT Technology' started by jizzmo, Sep 17, 2008.

  1. jizzmo

    jizzmo New Member

    Joined:
    Jul 9, 2008
    Messages:
    1,336
    Likes Received:
    0
    Okay, all of my other backgrounds are showing up in their div, except for the navigation background. biawokauns offered to help if i posted my code. the background image i want displayed is in the /*body elements*/ section under H2 thanks!
    :wavey:

    thanks!

    Code:
    
    /*Body elements*/
        body 
        {
            margin: 0;
            padding: 0;
            background: #1d1d1d;
            font-family: "Lucida Grande", Verdana, sans-serif;
            font-size: 100%;
        }
        
        h2     
        { 
            color: #999;
            margin-bottom: 0; 
            margin-left:13px;
            background: url(images/navigation.jpg)  no-repeat;
            height:55px;
        }
        
        h4    
        { 
            color: #FFF;
            margin-bottom: 0; 
            margin-left:13px;
            font-family: "Lucida Grande", Verdana, sans-serif;
            font-size: 100%;
        }
        
        h2 span
        {
            display: none;
        }
        
        p    
        { 
            margin-top: .5em;
            font-size: .75em;
            padding-left:15px;    
        }
    
    /*Navigation*/
        #navigation-block {
            position:relative;
            top:75px;
            left:75px;
        }
        
        #hide {
            position:absolute;
            top:30px;
            left:-190px;
        }
        
        ul#sliding-navigation
        {
            list-style: none;
            font-size: .75em;
            margin: 30px 0;
            padding: 0;
        }
        
        ul#sliding-navigation li.sliding-element h3,
        ul#sliding-navigation li.sliding-element a
        {
            display: block;
            width: 150px;
            padding: 5px 18px;
            margin: 0;
            margin-bottom: 5px;
        }
        
        ul#sliding-navigation li.sliding-element h3
        {
            color: #fff;
            background:#333 url(images/heading_bg.jpg) repeat-y;
            font-weight: normal;
        }
        
        ul#sliding-navigation li.sliding-element a
        {
            color: #FFF;
            background:#222 url(images/tab_bg.jpg) repeat-y;
            border: 1px solid #1a1a1a;
            text-decoration: none;
        }
        
        ul#sliding-navigation li.sliding-element a:hover { color: #62aacf;
        }
    
    /*About Content*/
        #about_content_box {    
            background:#2f2f2f url(images/leaveyourfootprint.png) no-repeat top left;
            color:#FFFFFF;
            border: 5px solid #3e3e3e;
            border-width: 5px 5px 5px;
            position:absolute;
            left:325px;
            top:75px;
            width:750px;
            height:400px;
            z-index:1;
        }
    /*Services Content*/
        #services_content_box {    
            background-color:#2f2f2f; 
            border: 5px solid #f14747;
            color:#f14747;
            border-width: 5px 5px 5px;
            position:absolute;
            left:325px;
            top:75px;
            width:750px;
            height:400px;
            z-index:1;
        }
    /*Portfolio Content*/
        #portfolio_content_box {    
            background-color:#2f2f2f; 
            border: 5px solid #5ea1c0;
            color:#5ea1c0;
            border-width: 5px 5px 5px;
            position:absolute;
            left:325px;
            top:75px;
            width:750px;
            height:400px;
            z-index:1;
        }
    /*Testimonials Content*/
        #testimonials_content_box {    
            background-color:#2f2f2f; 
            border: 5px solid #96BF55;
            color:#96BF55;
            border-width: 5px 5px 5px;
            position:absolute;
            left:325px;
            top:75px;
            width:750px;
            height:400px;
            z-index:1;
        }
    /*contact Content*/
        #contact_content_box {    
            background-color:#2f2f2f; 
            border: 5px solid #f1cf47;
            color:#f1cf47;
            border-width: 5px 5px 5px;
            position:absolute;
            left:325px;
            top:75px;
            width:750px;
            height:400px;
            z-index:1;
        }
        
        
    /*Footer*/
        #footer_box {
            font:Geneva, Arial, Helvetica, sans-serif;
            font-size:10px;
            text-align:center;
            color: #333333;
            background-color:#1d1d1d;
            position:absolute;
            left:325px;
            top:500px;
            width:750px;
            height:45px;
            z-index:1;
        }
    
    /*Lightbox style for portoflio*/
        #gallery {
            background-color: #444;
            padding: 10px;
            width: 730px;
            text-align:center;
        }
        #gallery ul { list-style: none; }
        #gallery ul li { display: inline; }
        #gallery ul img {
            border: 5px solid #1d1d1d;
            border-width: 5px 5px 5px;
        }
        #gallery ul a:hover img {
            border: 5px solid #5ea1c0;
            border-width: 5px 5px 5px;
            color: #fff;
        }
        #gallery ul a:hover { color: #1d1d1d; }
        
    /*Lightbox style for popup*/
        #jquery-overlay {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 90;
            width: 100%;
            height: 500px;
        }
        #jquery-lightbox {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 100;
            text-align: center;
            line-height: 0;
        }
        #jquery-lightbox a img { border: none; }
        #lightbox-container-image-box {
            position: relative;
            background-color: #5ea1c0;
            width: 250px;
            height: 250px;
            margin: 0 auto;
        }
        #lightbox-container-image { padding: 10px; }
        #lightbox-loading {
            position: absolute;
            top: 40%;
            left: 0%;
            height: 25%;
            width: 100%;
            text-align: center;
            line-height: 0;
        }
        #lightbox-nav {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            z-index: 10;
        }
        #lightbox-container-image-box > #lightbox-nav { left: 0; }
        #lightbox-nav a { outline: none;}
        #lightbox-nav-btnPrev, #lightbox-nav-btnNext {
            width: 49%;
            height: 100%;
            background: transparent url(___just-anything-here.gif) no-repeat; /* Trick IE into showing hover */
            display: block;
        }
        #lightbox-nav-btnPrev { 
            left: 0; 
            float: left;
        }
        #lightbox-nav-btnNext { 
            right: 0; 
            float: right;
        }
        #lightbox-container-image-data-box {
            font: 10px Verdana, Helvetica, sans-serif;
            background-color: #5ea1c0;
            margin: 0 auto;
            line-height: 1.4em;
            overflow: auto;
            width: 100%;
            padding: 0 10px 0;
        }
        #lightbox-container-image-data {
            padding: 0 10px; 
            color: #FFF; 
        }
        #lightbox-container-image-data #lightbox-image-details { 
            width: 70%; 
            float: left; 
            text-align: left; 
        }    
        #lightbox-image-details-caption { font-weight: bold; }
        #lightbox-image-details-currentNumber {
            display: block; 
            clear: left; 
            padding-bottom: 1.0em;    
        }            
        #lightbox-secNav-btnClose {
            width: 66px; 
            float: right;
            padding-bottom: 0.7em;    
        }
    
     
  2. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,914
    Likes Received:
    8
    Location:
    Los Angeles
    That element should work. Check the path to your image and make sure it exists.
     
  3. jizzmo

    jizzmo New Member

    Joined:
    Jul 9, 2008
    Messages:
    1,336
    Likes Received:
    0
    yea i'm an idiot... after looking at it i realized i changed it to a transparent png not a jpg... problem solved!
     

Share This Page