Simpel udbygning
HejJeg er ikke så god til css endnu, så dette er sikkert en nem opgave.
1) Jeg vil gerne have "topbar" til at gå helt ud til højre).
2) "Lftbar" skal placeres under "topbar" - ligesom i højre side.
3) Der skal oprettes en "bottombar" efter samme princip som "topbar"... bare i bunden af skærmen.
_______________________________________________
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style>
body {
margin:9px 9px 0 9px;
padding:0;
background:#FFF;}
#level0 {
background:#FC0;
width:100%;}
#level1 {
margin-left:200px;
padding-left:9px;
background:#FFF;}
#level2 {
background:#FFF3AC;
position:relative;
width:inherit;}
#main {
margin-right:9em;
border-right:1px solid #FC0;
padding-right:9px;
background:#FFF;}
#topBar {
background:#FC0;
width:100%}
#advBar {
background:#FFF3AC;
clear:right;
text-align:center;}
#tipDay {
float:right;
width:11em;
background:#FFF3AC;
position:relative;}
#lftBar {
position:absolute;
width:143px;
top:9px;
left:9px;}
#rgtBar {
position:absolute;
width:9em;
top:0;
right:0;}
#main h1 {
margin:0;
padding-left:.3em;
padding-right:5em;
font:1.25em Verdana,Helvetica,Arial;
color:#609;
background:#FC0;}
#main dt {
font-weight:bold;
font-size:120%;
margin-top:.8em}
#rgtBar h3 {
margin:0;
padding:3px;
background:#FC0;
font-weight:bold;
font-size:1em;
text-align:center;}
#topBar form {
float:right;
width:10.5em;
text-align:right;
margin:0;
line-height:.7em;}
#topBar input {font-size:.8em;}
#topBar b {
display:block;
text-align:left;
font:bold .8em/1.7em Arial,Geneva,sans-serif;
padding-left:.5em;}
#tipTit {
width:7em;
position:absolute;
text-align:center;
top:-1.8em;
right:0;
font:.8em/1.8em Arial,Geneva,sans-serif;}
#advBar p{text-align:right;margin:0 0.5em;font-weight:bold;}
#advBar img{margin-bottom:1em}
a img {border:none;}
.note {color:red}
</style>
</head>
<body>
<div id="level0">
<div id="lftBar">
The WebReference logo goes on the top. Some other boxes with news and
advertisement follows and then text links to internet.com.
</div>
<div id="level1">
<div id="topBar">
<form method=get action="http://webreference.com/cgi-bin/search.cgi">
<input type="text" name="query" size="12"><input type="submit" value="Search">
</form>
<b><a href="#">Sitemap</a> · <a href="#">Experts</a> · <a href="#">Tools</a> · <a href="#">Services</a> · <a href="#">Newsletters</a> · <a href="#">About</a></b>
<div id="advBar">
<p><a href="http://www.webref.com/cgi-bin/search.cgi">search WebRef</a></p>
<!-- START AD -->
An Advertising Banner goes here
<!-- END AD -->
</div>
</div>
<div id="level2">
<div id="rgtBar">
<h3><a href="#">Newsletters</a></h3>
Here goes a form to suscribe to the WebReference newsletter.
<h3><a href="#">Experts</a></h3>
Text links for this section.
<h3><a href="#">Sitemap</a></h3>
Text links for this section.
<h3><a href="#">Reference</a></h3>
Text links for this section.
</div>
<div id="level3">
<div id="main">
<h1><span style="">WebReference: Dev the Web™</span></h1>
<div id="tipDay">
<div style="position:relative">
<div id="tipTit">Tip of the Day</div>
This is the "Tip of the day" box.
</div>
</div>
<dl>
<dt><a href="#">HTTP for HTML Authors, Part III</a></dt>
<dd>We examine two of the most important functions of HTTP that HTML authors will be interested in: redirecting and form submission. By Stephanos Piperoglou. 0316</dd>
<dt><a href="#">HTTP for HTML Authors, Part III</a></dt>
<dd>We examine two of the most important functions of HTTP that HTML authors will be interested in: redirecting and form submission. By Stephanos Piperoglou. 0316</dd>
</dl>
<h1>internet.com</h1>
<dl>
<dt><a href="#">HTTP for HTML Authors, Part III</a></dt>
<dd>We examine two of the most important functions of HTTP that HTML authors will be interested in: redirecting and form submission. By Stephanos Piperoglou. 0316</dd>
<dt><a href="#">HTTP for HTML Authors, Part III</a></dt>
<dd>We examine two of the most important functions of HTTP that HTML authors will be interested in: redirecting and form submission. By Stephanos Piperoglou. 0316</dd>
</dl>
<br>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
