I'm not a wizzard with html/css, but i know what im doing.. enough to make a semi-decent site, anyway.
so ive got the code for page 1.
but with the background image for the header and footer (ill also be doing ones for the side and main divs when i fix this) im having a problem.
the footer div is 80px high, 860px wide.
i have an image for the background that is exactly the same dimensions.
but when i put it in for the background image, it apears smaller.. like this:
anyway. here's the site code.
- Code: Select all
<html><head><title> Keep Your Distance - Home </title>
<style type="text/css">
body{
font-family: sans;
font-size: 12px;
font-color: white;
background-color: #FFFFFF;}
a img{
border: none;}
a:link{
font-color: #777777;}
a:hover{
font-color: white;}
a:active, visited{
font-color: #7777777;}
.container{
position: absolute;
top: 0px;
left: 15%;
height: 1000px;
width: 900px;
z-index: 1;}
.head{
position: absolute;
top: 25px;
left: 0px;
height: 230px;
width: 860px;
border: 3px solid black;
z-index: 2;
background-color: #000000;
background-image:
url(/image/head_back.png);
background-repeat: no-repeat;}
.nav{
position: absolute;
top: 270px;
left: 0px;
height: 70px;
width: 860px;
border: 0px;
z-index: 2;
letter-spacing: -5px;}
.main{
position: absolute;
top: 350px;
left: 310px;
height: 500px;
width: 540px;
border: 2px solid black;
z-index: 2;
padding: 5px;}
.side{
position: absolute;
top: 350px;
left: 0px;
height: 500px;
width: 290px;
border: 2px solid black;
z-index: 2;
padding: 5px;}
.foot{
position: absolute;
top: 890px;
left: 0px;
height: 80px;
width: 860px;
border: 3px solid black;
z-index: 2;
background-color: #000000;
background-image:url(/image/foot_back.png);
background-repeat: no-repeat;
background-position: center;}
.banner_ad{
position: absolute;
top: 30px;
left: 180px;
height: 90px;
width; 500px;
border: 0px;
background-color: transparent;
z-index: 5;}
.logo_top{
position: absolute;
top: 120px;
left: 35px;
height: 110px;
width: 490px;
border: 0px;
background-color: transparent;
z-index: 3;}
.badge_top{
position: absolute;
top: 125px;
left: 710px;
height: 115px;
width: 115px;
border: 0px;
background-color: transparent;
z-index: 3;}
</style></head>
<body>
<div class="container">
<div class="banner_ad">
<a href="http://www.resistrecords.com" target="_blank"><img src="http://i304.photobucket.com/albums/ nn189/ carpathianx/isolationweb.gif"></a>
</div>
<div class="logo_top">
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/metro.png">
</div>
<div class="badge_top"></div>
<div class="head"></div>
<div class="nav"><center>
<a href=""><img src="http://i112.photobucket.com/albums/n181/hahaha_052/home_nav.png"></a>
<a href=""><img src="http://i112.photobucket.com/albums/n181/hahaha_052/content_nav.png"></a>
<a href=""><img src="http://i112.photobucket.com/albums/n181/hahaha_052/win_nav.png"></a>
<a href=""><img src="http://i112.photobucket.com/albums/n181/hahaha_052/friends_nav.png" height="70px" ></ a><a href=""><img src="http://i112.photobucket.com/albums/n181/hahaha_052/forum_nav.png"></a>
</center></div>
<div class="main">
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/news.png" width="200px"><br /><br /><br />
<img src="http://guides.news.com.au/music/media/x350/141711_121703_carpathian_june_tour_06_1_.jpg" height="100px" align="left">
<b>Carpathian Release New CD And Announce Tour Dates</b><br />
MELBOURNE'S Carpathian have released their newest CD, entitled "Isolation" on Resist Records.<br />
Release tour across Australia throughout July and August.<br /><br />
<a href="" align="right">>> Read More</a><br /><br /><br /><br />
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/sep_main.png" height="3px" width="500px">
</div>
<div class="side">
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/reviews.png" width="200px"><br /><br /><br />
<img src="http://www.pyromusic.net/images/review_covers/Miles_Away-Rewind,_Repeat-Review.jpg" width="60px" height="60px" align="left">
<b align="top">Miles Away - "Rewind, Repeat.."</b><br />
<a href="">>> Review</a><br /><br /><br /><br />
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/sep_side.png" height="2px" width="250px"><br /><br /><br />
<img src="http://www.commonbondrecords.com/images/cd-cbr19.gif" width="60px" height="60px" align="left">
<b>Break Even - "Young At Heart"</b><br />
<a href="">>> Review</a><br /><br /><br /><br />
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/sep_side.png" height="2px" width="250px"><br /><br /><br />
<img src="http://www.resistrecords.com/images/releases/h2o_nothingtoprove.jpg" width="60px" height="60px" align="left">
<b>H20 - "Nothing To Prove"</b><br />
<a href="">>> Review</a><br /><br /><br /><br />
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/sep_side.png" height="2px" width="250px"><br /><br /><br />
<img src="http://ecx.images-amazon.com/images/I/51FgF054f7L.jpg"" width="60px" height="60px" align="left">
<b>The Ghost Inside - "Fury And The<br />Fallen Ones"</b><br />
<a href="">>> Review</a><br /><br /><br /><br />
<img src="http://i112.photobucket.com/albums/n181/hahaha_052/sep_side.png" height="2px" width="250px"><br /><br /><br />
</div>
<div class="foot"><center><small>
<font color="#FFFFFF"><br />
copyright - all content - keep your distance<br />
all rights reserved. 2008.<br /><br /><br />
<a href="">contact</a> / <a href="">advertise with us</a>
</font>
</small></center></div>
</div>
</body></html>
it's not 100% finished. obviously.
and all other images are hosted externaly, so they'll work on your comp.
(about badge_top: still working on image for in here)
CC is apreciated, also.
