Menu
So.
I have decided to convert my psd static pages into css… as I have learned that css is much easier to work with. This is quite a task since I am new to css, however, I would like to know:
How can I specify a main content area where the picture is a repeating background in which I can type on? It was easy from a table perspective because I simply inserted the background image and constrained the table width only. Does anyone have any suggestions?
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “
<html xmlns=”
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>CSS Slicing Guide </title>
<style type=”text/css”>
#header {
height: 117px;
padding-bottom: 0px;
background:url(headers_01.gif);
}
#header2 {
position: relative;
top: 0px;
left: 0px;
}
#header3 {
position: relative;
top: 0px;
left: 0px;
}
#main {
width: 766px;
margin: 0 auto 0 auto;
float: left;
background-image:url(headers_04.gif/bg-repeat.png);
}
body {
margin: 0;
padding: 0;
text-align: center;
background-color: #333333;
}
#container {
width: 766px;
margin: 0 auto 0 auto;
text-align: left;
}
.clear {
clear: both;
}
</style>
</head>
<body>
<div id=”container”>
<div id=”header”> </div>
<div id=”header2″> <img id=”header2″ img src=”headers_02.gif” width=”766″ height=”287″/></div>
<div id=”header3″> <img id=”header3″ img src=”headers_03.gif” width=”766″ height=”95″/></div>
<div id=”content”>
<div id=”main”> </div>
<div class=”clear”></div>
</div>
</div>
</body>