In my browser I highlighted to make it easier to see. I circled the problem. Why is that spacing there? The banner and the tables width are equal. And on the right side of the banner it flows passed the table, for some reason it just wont center, even with center tags i had on the first time. Here is the coding so far:
Quote:
<!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=utf-8" />
<title>Grim Concepts</title>
<link href="CSSgrim.css" rel="stylesheet" type="text/css" /><!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColLiqLtHdr #sidebar1 { padding-top: 30px; }
.twoColLiqLtHdr #mainContent { zoom: 1; padding-top: 15px; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
</head>
<body class="twoColLiqLtHdr">
<div id="container">
<div id="header">
<img src="bcbanner.png" width="800" height="500" align="left" />
<!-- end #header -->
</div>
<div id="sidebar1">
<h3>sidebar1 Content</h3>
<p>The background color on this div will only show for the length of the content. If you'd like a dividing line instead, place a border on the left side of the #mainContent div if the #mainContent div will always contain more content than the #sidebar1 div. </p>
<p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</p>
<!-- end #sidebar1 --></div>
<div id="mainContent">
<h1> Welcome</h1>
<p>Welcome to Grim Concepts. We strive to deliver the best quality logos and other graphic needs for you or your business.</p>
<h2>About Us</h2>
<p>With extensive knowledge of Adobe Photoshop we have been improving our skills for the last 6 years and continue to do so.</p>
<!-- end #mainContent --></div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<div id="footer">
<p>Footer</p>
<!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>
|
Last edited by xkillaz4x; 02-18-2010 at 03:03 AM..
|
