0

I just started the process of learning CSS web design so I’m fairly certain my code is a little messy but I was hoping someone might be able to help me out.

I am working on a website with a large background image. It works just fine in google chrome, firefox and IE8, but IE7 the background image shows up when you first open the page but disappears if you click away from the homepage and return.

Is this a bug in ie7? Does anyone know of a quick fix? I would hate to have to redesign the whole site.

Also, my logo at the top of my page’s location changes when I open it on a blackberry. Is there anything in my coding that can be fixed to prevent this?

Thanks!
Drew

CSS:

@font-face {font-family: "museosans_500"; src: url(css/fonts/museosans_500.otf) format("opentype");
}

body {
    font-family: "museosans_500", Arial, Helvetica, sans-serif;
    font-size:small;
    color:#000;
    background-color:#000;
    margin: 0;
    padding: 0;
    background-image:url(images/bg.jpg);
}

#container {
    width:800px;
    height: 500px;
    margin:0 auto;
    background-position:50px -30px;
    background-repeat:no-repeat;
    font-family: "museosans_500", "lucida grande", Helvetica, arial, sans-serif;
    }

#logo {
    width:299px;
    height:80px;
    background-image:url(images/logo.png);
    margin-top:35px;
    margin-left:10px;
    position: absolute
}

HTML

<body> 

<div id="container"> 
            <a href="index.html"><div id="logo" title="."></div></a> 
                          <div id="menu"> 
                                <a href="index.html">home</a>  
                                <a href="about.html">about</a>  
                                <a href="menu.html">menu </a>  
                                <a href="reservations.html">reservations</a>  
                                <a href="location.html">location</a> 
                          </div> 

                        <div id="content"><img src="images/tomato.jpg" </div> 
                    </div> 



    </div>
</body> 
 </html>

Edited by mike_2000_17: Fixed formatting

3
Contributors
2
Replies
3
Views
7 Years
Discussion Span
Last Post by Rajib Ganguly
0

do you have a live version of this or something I dont see anything terribly wrong with the code especially regarding the body background image. I might suggest just putting the image in a div with an img tag and then preloading it in the css so id have like
<container>
<img />
<header></header>
<content></content>
<footer></footer>
<div id="preload">
</div>

#preload{background: url(img);display:none;}

0

hi,

this is not a problem, it a bug for IE7
please replace the code, and try.

body {

   font-family: "museosans_500", Arial, Helvetica, sans-serif;
   font-size:small;
   color:#000;
   background-color:#000;
   margin: 0;
   padding: 0;
   background:url(images/bg.jpg);
}

Hope its ok now.

Edited by Rajib Ganguly: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.