Log in

View Full Version : Resolved Floating DIV Bg's not showing...


dillankid
02-23-2009, 06:33 PM
The backgrounds in my floating div's on this page won't show up:
http://www.judahgraphics.com/dxm/ws/bands.html

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Digital XTreme Media</title>
<link href="styles.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="container">
<div id="topimage"><a href="index.html"><img src="home.jpg"></a></div>
<div id="menu">
<img src="menu_r1_c1.jpg"><a href="bands.html"><img src="menu_r1_c2_f2.jpg"></a><img src="menu_r1_c3.jpg"><a href="models.html"><img src="menu_r1_c4.jpg"></a><img src="menu_r1_c5.jpg"><a href="street.html"><img src="menu_r1_c6.jpg"></a><img src="menu_r1_c7.jpg"><a href="store.html"><img src="menu_r1_c8.jpg"></a><img src="menu_r1_c9.jpg"></div>
<div id="featuredband">
<p><img src="feat_btn.png"></p>
</div>
<div id="bandlist">
<div class="bandthumbnails"><a class="zepict" style="background-image: url(/akid/akidband.jpg);" href="/bands/akid/index.html">
<a href="/bands/akid/index.html"></a><a href="/bands/akid/index.html">Adrenaline Kid</a></div>
<div class="bandthumbnails"><a class="zepict" style="background-image: url(/akid/akidband.jpg);" href="/bands/akid/index.html">
<a href="/bands/akid/index.html"></a><a href="/bands/akid/index.html">Adrenaline Kid</a></div>
<div class="bandthumbnails"><a class="zepict" style="background-image: url(/akid/akidband.jpg);" href="/bands/akid/index.html">
<a href="/bands/akid/index.html"></a><a href="/bands/akid/index.html">Adrenaline Kid</a></div>
<div class="bandthumbnails"><a class="zepict" style="background-image: url(/akid/akidband.jpg);" href="/bands/akid/index.html">
<a href="/bands/akid/index.html"></a><a href="/bands/akid/">Adrenaline Kid</a></div>
<div class="bandthumbnails"><a class="zepict" style="background-image: url(/akid/akidband.jpg);" href="/bands/akid/index.html">
<a href="/bands/akid/index.html"></a><a href="/bands/akid/index.html">Adrenaline Kid</a></div>
<div class="bandthumbnails"><a class="zepict" style="background-image: url(/akid/akidband.jpg);" href="/bands/akid/index.html">
<a href="/bands/akid/index.html"></a><a href="/bands/akid/index.html">Adrenaline Kid</a></div>
</div>
</div>
</body>
</html>

CSS

@charset "utf-8";
/* CSS Document */

body {
background:#FFFFFF;
background-image:url(bg.jpg);
background-repeat:repeat-y;
background-position:top;
}

a {
outline: none;
}
a img {
border:none;
}

/*Main Page Properties Begin Here*/

/*Container, This holds everything in the center of the page.*/
#container {
background: none;
width: 797px;
position: relative;
margin: 0 auto;
margin-top: -8px;
}
/*Top Image*/
#topimage {
background-image:url(topimage.jpg);
width:793px;
height:249px;
position:absolute;
margin:0 auto;
margin-top:2px;
left:3px;
}
/*Menu Section*/
#menu {
position:absolute;
margin:0 auto;
margin-top:250px;
width:793px;
height:39px;
left:3px;
}
/*Featured Artist Section*/
#featuredtable {
position:absolute;
background-color:#a5a5ad;
background-image:url(left_bgs.png);
background-position:top right;
background-repeat:repeat-y;
width:365px;
height:auto;
margin-top:289px;
margin-left:5px;
padding-left:5px;
padding-right:15px;
}
/*Events Section *IMPORTANT* -> (Currently not used, Events is included in the Featured Artist Section)*/
#eventstable {
position:absolute;
background-color:#a5a5ad;
background-image:url(left_bgs.png);
background-position:top right;
background-repeat:repeat-y;
width:375px;
height:auto;
margin-top:669px;
margin-left:5px;
padding-left:5px;
padding-right:5px;
}
/*News Section*/
#newstable {
position:absolute;
background-color:#a5a5ad;
background-image:url(news_bg.png);
background-position:top left;
background-repeat:repeat-y;
width:365px;
height:auto;
margin-top:289px;
margin-left:405px;
margin-bottom:0px;
padding-left:25px;
padding-right:0px;
padding-top:25px;
}
/*Main Page Properties End Here*/

/*Bands Page Properties Begin Here*/
/*Featured Band Section*/
#featuredband {
position:absolute;
background-color:#a5a5ad;
background-image:url(akid.jpg);
width:793px;
height:331px;
margin-top:289px;
margin-left:3px;}

/*News Section*/
#bandlist {
position:absolute;
background-color:#a5a5ad;
background-image:url(bands_bg.png);
background-position:top left;
background-repeat:repeat-y;
width:738px;
height:auto;
margin-top:620px;
margin-left:5px;
margin-bottom:0px;
padding-left:38px;
padding-right:15px;
padding-top:10px;
}
.bandthumbnails {
-x-system-font:none;
background-color:#a5a5ad;
float:left;
font-family:Georgia,Times,Serif;
font-size:12px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
height:202px;
line-height:22px;
margin:0 25px 15px 0;
text-align:center;
width:220px;
left: 23px;
top: 9px;
}
.bandthumbnails a.zepict {
background-position:left top;
background-repeat:no-repeat;
display:block;
height:180px;
margin:0;
width:220px;
}
/*Band Template Properties End Here*/

/*Model Template Properties Begin Here*/

/*Model Template Properties End Here*/

/*Street Team Template Properties Begin Here*/

/*Street Team Template Properties End Here*/

/*Store Template Properties Begin Here*/

/*Store Template Properties End Here*/
Snookerman
02-23-2009, 06:44 PM
The slash means that the akid folder is in the root which it's not. Remove the slash and you should be fine:

url(/akid/akidband.jpg)

Good luck!
dillankid
02-23-2009, 06:49 PM
Beautiful - thank you very much!
Snookerman
02-23-2009, 06:56 PM
You're welcome, glad to help!

Good luck with your site!