September 12th, 2007, 11:07 AM
|
 |
Constant Learner
|
|
Join Date: Jun 2005
Posts: 487
Time spent in forums: 4 Days 7 h 14 m 17 sec
Reputation Power: 4
|
|
|
Pleaseeeeeeeeeeeeee
I am making a layout in css.
and just wanted to know if i was doing it right so far, can someone look aty my code to see if its good or not.
many thanks
css code
Code:
#container {width:900px; background-color: #000000}
#header {width:100%; min-height:89px; max-height:89px; background-color:#FF6600}
#linkholder {width:100%; min-height:23px; max-height:23px; background-color:#374256}
A:link {text-decoration: none; color: #0099FF}
A:visited {text-decoration: none; color: #0099FF}
A:active {text-decoration: none; color: #0099FF}
A:hover {text-decoration: underline; color: #FFFFFF}
#contentcontainer {float:right; background-color: #3399FF; width:754px; height:100%; }
#news { float:left; margin-left:20px; background-color:#0066FF; min-width:350px; max-width:350px; margin-top:10px; margin-bottom: 20px; border-right:#CCCCCC thin solid }
#rightinfo { float:right; margin-right:20px; background-color:#0066FF; min-width:350px; max-width:350px; margin-top:10px; margin-bottom: 20px }
#belownews{ clear:both; background-color: #0099FF; width:560px; margin-right:20px; margin-left:20px; border-top: #CCCCCC thin; margin-top:20px }
#leftcoloum {float:left; background-color: #015eb0; min-width:146px; max-width:146px; height:100%; overflow:hidden; margin-bottom:0px;}
#bottomlinks { clear:both; width:100%; min-height:23px; max-height:23px; background-color:#374256}
#bottombar { width:100%; min-height:26px; max-height:26px; background-color:#374256}
Html code
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<!-- link top stlye sheet -->
<LINK href="css/grids.css" rel="stylesheet" type="text/css">
<!-- End link to Style sheet -->
<style type="text/css">
<!--
.style1 {
color: #CCCCCC;
font-weight: bold;
}
body {
background-image: url(images/Underwater_Bubbles_by_X_Anime_Fan_X.jpg);
background-color: #015EB0;
}
.style4 {font-size: 16px}
.style6 {
color: #CCCCCC;
font-size: 16px;
font-weight: bold;
}
.style8 {font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 12px; color: #FFFFFF; }
.style9 {color: #FFFFFF; }
.style10 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #FFFFFF; }
-->
</style>
</head>
<body>
<!--Container to hold all the elements -->
<center><div id="container">
<!--Header to hold the logo -->
<div id="header"><img src="images/layout_01.jpg" width="900" height="89" /></div>
<!--end of Header to hold the logo -->
<!--link holder grey bar that sits underneath the header -->
<div id="linkholder">
<div align="left">
<a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home
</a> | <a href="http://www.google.co.uk">Home
</a> |
<a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | <a href="http://www.google.co.uk">Home </a> | </div>
</div>
<!--end of holder grey bar that sits underneath the header -->
<!--************************************************** **************** -->
<!--content container to hold the content -->
<div id="contentcontainer">
<!-- news section -->
<div id="news">
<p align="center" class="style1"><span class="style4">News</span><br />
---------</p>
<p align="left" class="style10">Welcome to reef lovers. Where people come to Socialise with other reef lovers. Now take these 2 wallpapers and wack em on your desktop. Welcome to reef lovers. Where people come to Socialise with other reef lovers. Now take these 2 wallpapers and wack em on your desktop</p>
<p align="left" class="style10">Welcome to reef lovers. Where people come to Socialise with other reef lovers. Now take these 2 wallpapers and wack em on your desktop. Welcome to reef lovers. Where people come to Socialise with other reef lovers. Now take these 2 wallpapers and wack em on your desktop</p>
</div>
<!-- end of news section -->
<!-- rightinfo section -->
<div class="style6" id="rightinfo">
<p>Welcome To The Tanks<br />
<span class="style1">---------</span></p>
<table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#CCCCCC" bgcolor="#0066FF">
<tr>
<td width="50px" bgcolor="#0033FF"><div align="center" class="style9">Tank Owner </div></td>
<td width="50px" bgcolor="#0033FF"><div align="center" class="style9">Pic</div></td>
<td width="50px" bgcolor="#0033FF"><div align="center" class="style9">Details</div></td>
</tr>
<tr>
<td width="" bgcolor="#0099FF"><div align="right" class="style9">Ben</div></td>
<td bgcolor="#0099FF"><div align="center" class="style9"><a href="tank1.html"><img src="images/thumb/tank1.gif" alt="tank1" width="119" height="85" border="0" /></a></div></td>
<td bgcolor="#0099FF"><span class="style9">NA</span></td>
</tr>
</table>
</div>
<!-- end of rightinfo section -->
<!-- rightinfo section -->
<div id="belownews">
<p class="style9">Welcome to the </p>
<p><span class="style8">Welcome to reef lovers. Where people come to Socialise with other reef lovers. Now take these 2 e </span></p>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><div align="center"><a href="wallpaper2.html"><img src="images/thumb/windowslivewriterpufferfish.jpg" alt="puffer" width="100" height="89" border="2" /></a></div></td>
<td><div align="center"><a href="wallpaper1.html"><img src="images/thumb/wallpaper.jpg" alt="fus" width="100" height="89" border="2" /></a></div></td>
<td><div align="center"><a href="wallpaper4.html"><img src="images/thumb/tropical_fish_wallpaper.jpg" alt="tang" width="100" height="89" border="2" /></a></div></td>
<td><div align="center"><a href="wallpaper3.html"><img src="images/thumb/clown-fish2.jpg" alt="clown" width="100" height="89" border="2" /></a></div></td>
</tr>
</table>
</div>
<!-- end of rightinfo section -->
</div>
<!-- end of content container to hold the content -->
<!--************************************************** **************** -->
<!--left content to hold the content -->
<div id="leftcoloum">
<p>thththhthththhgfhfghghgdrgorgkgrkgrkekgg</p>
<p> </p>
<p> </p>
<p align="right"><img src="images/layout_12.jpg" width="124" height="203" align="absbottom" /></p>
</div>
<!-- left content container to hold the content -->
<!--bottom links -->
<div id="bottomlinks"> rthtrhhth</div>
<!-- bottom links -->
<!--bottom bar -->
<div id="bottombar"> <img src="images/layout_08.jpg" width="900" height="26" /></div>
<!-- bottom bar -->
</div>
</center>
<!-- end of the container -->
</body>
</html>
__________________
dsaddigh 
|
ASP Free Forums Sponsor:
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
