DramaticDisaster

Domain Layouts

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>YOUR TITLE HERE</title>
<style type="text/css">

a {text-decoration:none; color:#93c}
a:hover {text-decoration:none; background-color:#93C; color:#000}
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #666666;
	text-align: center;
	background-color: #767D8D;
}
.twoColHybLtHdr #container { 
	width: 80%;  
	background: #FFFFFF;
	margin: 0 auto; 
	border: 1px solid #000000;
	text-align: left; 
} 
.twoColHybLtHdr #header { 
	background: #DDDDDD; 
	padding: 0 0px; 
} 
.twoColHybLtHdr #header h1 {
	margin: 0; 
	padding: 0px 0; 
}

.twoColHybLtHdr #sidebar1 {
	float: left; 
	width: 12em; 
	background: #ffffff; 
	padding: 0px 0; 
	border:3px solid black;
}

.twoColHybLtHdr #mainContent { 
	margin: 0 0px 0 0em; 
	border: 3px solid black;
} 
.twoColHybLtHdr #footer { 
	padding: 0 0px; 
	background:#ffffff;
	border: 3px solid black;

} 
.twoColHybLtHdr #footer p {
	margin: 0; 
	padding: 0px 0; 
}

.fltrt { 
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
--> 
</style>
</head>

<div id="container">
  <div id="header">
    <center><img src="http://i523.photobucket.com/albums/w353/dramaticdisasterxlyts/demi.jpg" border="3px solid black" width="980px"></center>
  </div>
  <div id="sidebar1">
    <font size="+2" weight="bold">Sidebar Title 1</font><br>
    <a href="#">Side Content</a><br><br>
    
    <font size="+2" weight="bold">Sidebar Title 2</font><br>
    <a href="#">Side Content</a><br><br>
   
    <font size="+2" weight="bold">Sidebar Title 3</font><br>
    <a href="#">Side Content</a><br><br>
    
    <font size="+2" weight="bold">Sidebar Title </font><br>
    <a href="#">Side Content</a>
  </div>
  <div id="mainContent">
    <h1> Main Content Title</h1>
    <p>Main Content</p><br><br><br><br><Br><br><br>
	</div>
	<div id="footer">
    <p><center>(c) Layout created by DramaticDisaster_Lyts</center></p>
  </div></div>
</body>
</html>

<head>
<html>
<title>Your Title Here</title>
</head>
<body>
<style type="text/css">

b {color:#C9C;} 
u {color:#309;} 
i {color:#F9C;} 
s {color:#3F6;}

a:active, a:visited, a:link{ 
font-size : 12px;
color : #000000;
font-family : cooper std;
font-weight : normal;
text-decoration : none;
text-align:center;
} 
 a:hover{
font-size : 12px;
color : #ffffff;
font-family : cooper std;
font-weight : normal;
text-decoration : none;
}

a {cursor:crosshair}

a:link img { 
border : none;
} 
a:visited img { 
border : none;
} 
a:hover img { 
border : none;
}

a.hova,a.hova:link,a.hova:active,a.hova:visited{background-color:;text-decoration:none;display:block}a.hova:hover{background-color:456EBD;text-decoration:none;display:block;}

a.hovaa,a.hovaa:link,a.hovaa:active,a.hovaa:visited{background-color:;text-decoration:none;display:block}a.hovaa:hover{background-color:E8DEE9;text-decoration:none;display:block;}

textarea{width:130px; height:15px}

body
{
background-image:url(http://i523.photobucket.com/albums/w353/dramaticdisasterxlyts/pwettylines.jpg);
background-repeat:repeat-y;
background-position:center;
background-color:000000;
margin:0px;
padding:0px;
cursor:crosshair;
text-align:center;
font:"Comic Sans MS", cursive;}

.sidebar
{
font:Georgia, "Times New Roman", Times, serif;
color:#0CC;
font-weight:bold;
font-size:40px;
line-height :39px;
letter-spacing :-3px;
text-align:center;
background-color:transparent;
}

.main
{
font:Georgia, "Times New Roman", Times, serif;
color:#0CC;
font-weight:bold;
font-size:40px;
line-height:39px;
letter-spacing:-3px;
text-align:center;
background-color:transparent;
}

.header
{
background-color:transparent;
padding:0px;
width:900px;
height:400px;
position:absolute;
}

#sidebar {position:absolute; top:379px; left:239px; width:246x;}
#main {position:absolute; top:379px; left:477px; width:548px;}
#header{left:166px; top:0px;}
#footer {margin:10px; padding:10px;}

</style>

<div id="sidebar">
<div class="sidebar">Sidebar Title 1</div>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>

<div class="sidebar">Sidebar Title 2</div>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>

<div class="sidebar">Sidebar Title 3</div>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>

<div class="sidebar">Sidebar Title 4</div>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>
<a href="#" class="hovaa">Link</a>
<a href="#" class="hova">Link</a>

<div class="sidebar">Layout Credit</div>
<a href="http://dramaticdisaster.thelolspace.net" class="hovaa">DramaticDisaster_Lyts</a>
<br>
</div>

<div id="main">
<div class="main">Main Content Title</div>
Main Content goes here.
</div>
</body>
</html>

Back