2 Replies Latest reply on Mar 23, 2010 2:45 PM by ruthvik89

    Background not working properly

    ruthvik89

      Hi,

      I am pretty new to this coding stuff. Recently I tried to make a website from a photoshop doc. I imported into fireworks, sliced up the regions I need and exported as css and images (.htm). When I opened up in dreamweaver, I set the background of the page to black in page properties, and add a tag for <main> to make background image the one I wanted. Now when I view in Dreamweaver it shows up correctly with the background image I want, but when I view in IE or Firefox, everywhere there isn't a div, it shows up black instead of the background image. What am I doing wrong?

       

      Here is the CSS file code:

       

      body {
           margin:0px;
           padding:0px;
      }
      .p {
           margin:0px;
           padding:0px;
           font-size: inherit;
           font-family: inherit;
           font-weight: inherit;
           text-align: inherit;
           color: inherit;
           line-height: inherit;
           vertical-align: top;
      }
      p {
           padding-top:0px;
           margin-top:0px;
      }
      img {
           border:0px;
      }
      div {
           margin:0px;
           padding:0px;
           font-family:verdana; font-size:12px;
      }
      .AbsWrap {
           width: 100%;
           position: relative;
      }
      .rowWrap {
           width: 100%;
      }
      .clearfloat {
           clear:both;
           height:0px;
      }
      a:link, a:visited{
           COLOR:inherit;
           text-decoration:inherit;
      }
      #main {
           width:1024px;
           margin: 0px auto 0px auto;
           border: 0px solid #f0f0f0;
           background-image: url(images/background.gif);
      }
      #banner {
           margin-left:0px;
           margin-top:1px;
           width:1024px;
           height:210px;
           margin-bottom:0px;
           float:left;
           display:inline;
           background-image: url(images/banner.gif);
           overflow:hidden;

      }
      #sidebar {
           margin-left:29px;
           margin-top:36px;
           width:175px;
           height:735px;
           margin-bottom:0px;
           float:left;
           display:inline;
           background-image: url(images/sidebar.png);
           overflow:hidden;

      }
      #contentbox {
           margin-right:29px;
           margin-top:68px;
           width:752px;
           height:569px;
           margin-bottom:0px;
           float:right;
           display:inline;
           background-image: url(images/contentbox.png);
           overflow:hidden;

      }
      #footer {
           margin-left:1px;
           margin-top:0px;
           width:1023px;
           height:66px;
           margin-bottom:0px;
           float:left;
           display:inline;
           background-image: url(images/footer.jpg);
           overflow:hidden;

      }