Refresh for background to work

Hello eveyone

I was hoping someone could explain to me why i need to refresh my browser to get my gradient background to work since coding a navigation bar into my css?

The first page is fine but then after following a link in the navbar the background only works after refreshing the page.

Html code

<html>
<head>
<Center>
<a href="http://photobucket.com" target="_blank" "align=center" ><img src="http://i214.photobucket.com/albums/cc158/ianac1/GlasgowImage.jpg" border="0" alt="Photo Sharing and Video Hosting at Photobucket"></a>
</Center>
<LINK REL=StyleSheet HREF="style1.css" TYPE="text/css"

</head>

<ul>

<li><a href="History.html"> History </a></li>

<li><a href="EatingOut.html "> Eating Out </a></li>

<li><a href="Nightlife.html"> Nightlife </a></li>

<li><a href="Attractions.html"> Attractions </a></li>

<li><a href="Football.html"> Football </a></li>

<li><a href="Links.html"> Links </a></li>

</ul>

<h1>
<CENTER>
Glasgow Attractions
</CENTER>
</h1>

</div>

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

css code

body {
background: white url(http://i214.photobucket.com/albums/cc158/ianac1/Background2.jpg )
background-repeat: repeat-x;
}

h1 {font : 24pt Arial; color: black;}

h1, h2, h3, h4, h5 {font : 16pt Arial; color: black;}

#longlines {
clip : auto;
overflow : scroll;
}

#navbar {

list-style: none;
margin: 0; padding: 0;
align:center

}
#navbar li {
float: left;
white-space: nowrap;
display: inline;
}
#navbar li a {
display: block;
background: black;
width: 150px;
text-align: center;
color: white;
padding: 3px 0;
}
#navbar li a:hover {
background: white;
color: black;
}

#div1 { float:left; width:80%; align:center;}
#div2 { margin-left:30%; width:80%; align:center;}
#div3 { position;absolute right:25%;}
#divFootball

I have removed all irrelevant data so i hope i,ve marked this up OK

Thanks
Ian

Refresh for background to work

ianac1

lavazza

Dabrowski

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week