Looked almost ok in my editor but not so good in fire fox. I was going for a layout that was elastic some what. A header with one image repeating 100%, an there image slightly to the left also in the header, a container a 20% wide box for a list, two 80% wide boxes for content, a footer with the same image set up to end it. It was looking almost there for white but the footer image could now
be viewed.
?=
be viewed.
?=
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head><title>?????</title>
<style type="text/css">
/*------------------pic------width:11px height:257px-------*/
body {
font: Tahoma;
color: #999999;
background-color: #626262;
margin: 0px;
padding: 0px;
background-image: url(ffbgtoprepeat.png);
background-repeat: repeat-x;
}
/* ----- LAYOUT ------------------------------------------------------------------------------------------------------ */
#Container {
background: url(bg_main.gif) repeat-y;
width: 100%;
margin-top: 0px;
padding-top: 0px;
}
/*------------------pic------width:660px height:257px the pic is 1px higher than the repeated image-------*/
#header
{padding: 0px;
margin: 0px;
background: url(ffbgtopmain.png) no-repeat right top;
clear:both;width:660px%;height:258px;
}
#Welcome
{margin-left:17.%;
background: url(date2.png) no-repeat left top;
width:80%;
height:200px;
border:1px solid #000000;position: justify;
}
#News
{margin-left:17.%;
background: url(date2.png) no-repeat left top;
width:80%;
height:200px;
border:1px solid #000000;position: justify;
}
#Linklist
{
marging-left:18%
width: 200px;height: 400px;
font: 10px Tahoma;
position: absolute;
top: 258px;
right: 819px;
border:1px solid #000000;}
}
/*------------------pic------width:18px height:110px-------*/
#Footer
{
background-image: url(ffbgtoprepeat.png);
background-repeat: repeat-x;
border:1px solid #000000;position:relative;}
/*------------------pic------width:660px height:110px-------*/
/*---not used---*/#Footerimage
{
background: url(ffbottomrepeat.png) no-repeat right bottom;
width:100%;
height: 110px;}
</style>
</head>
<body>
<div id="Container">
<div id="header">
<div id="Breadcrumbs"></div></div>
<div id="Welcome">Welcome</div>
<div id="News">News</div>
<div id="Linklist"> Linklist</div>
<div id="Footer">Footer</div>
</div>
</body>
</html>
Comment