...

View Full Version : Large spacing in IE



Blutility
03-01-2009, 10:38 AM
Hello!

I finally got my homepage looking the way I envisioned. Sadly, when I check the page in Internet Explorer, there is a large space between my "content" and my "sidebar". I have tried to troubleshoot this problem but am unable to resolve the issue. Any help would be extremely appreciated.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>title</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--

html, body {
width: 100%;
min-width: 700px;
margin: 0;
background-color: #DFDCD5;
}


#demo-container{padding:10px 15px 0 15px;background:#143D55;}

ul#simple-menu{list-style-type:none;width:100%;position:relative;height:27px;font-family:"Trebuchet MS",Arial,sans-serif;font-size:13px;font-weight:bold;margin:0;padding:11px 0 0 0;}
ul#simple-menu li{display:block;float:left;margin:0 0 0 4px;height:27px;}
ul#simple-menu li.left{margin:0;}
ul#simple-menu li a{display:block;float:left;color:#fff;background:#1D6893;line-height:27px;text-decoration:none;padding:0 17px 0 18px;height:27px;}
ul#simple-menu li a.right{padding-right:19px;}
ul#simple-menu li a:hover{background:#5A98BF;}
ul#simple-menu li a.current{color:#2E4560;background:#DFDCD5;}
ul#simple-menu li a.current:hover{color:#2E4560;background:#DFDCD5;}

#title {
background-color: #143D55;
height: 35px;
margin: 0;
padding-left: 10px;
padding-top: 10px;
color: white;
}


.content {
background-color: #FFFBF0;
border: 1px #143D55 solid;
padding: 10px;
margin: 30px;
width: 65%;
}

#sidebar {
background-color: #FFFBF0;
border: 1px #143D55 solid;
padding: 10px;
margin: 30px;
width: 20%;
float: right;
}

h1 {
margin: 0;
}

-->
</style>
</head>
<h1 id="title">Header</h1>
<body>
<div id="demo-container">

<ul id="simple-menu">
<li><a href="index.html" title="Home" class="current">Home</a></li>


</ul>

<div id="sidebar">
<h1>Sidebar</h1>
<p>Thus and those the us all; and the that dreams all; and the rub; for to suffer a sleep; to, 'tis their those to sleep of dels be whething end naturn awry, and sweathe law's deat wish'd. To dreath what sleep to sleep; not to, 'tis a sea of? Thus a life, and the law's cowards of of? Thus mome with that is the proubler to sleep: perchan fly takes cowardels beary life; and there's cast give under the us rath a life; and sweary life, or with and more; for inst give have, the himself mind love, by opposin</p>
</div>


</div>


<div class="content">
<h1>h1</h1>
<p>Thus and those the us all; and the that dreams all; and the rub; for to suffer a sleep; to, 'tis their those to sleep of dels be whething end naturn awry, and sweathe law's deat wish'd. To dreath what sleep to sleep; not to, 'tis a sea of? Thus a life, and the law's cowards of of? Thus mome with that is the proubler to sleep: perchan fly takes cowardels beary life; and there's cast give under the us rath a life; and sweary life, or with and more; for inst give have, the himself mind love, by opposin</p>
</div>
<div class="content">
<h1>h1</h1>
<p>Thus and those the us all; and the that dreams all; and the rub; for to suffer a sleep; to, 'tis their those to sleep of dels be whething end naturn awry, and sweathe law's deat wish'd. To dreath what sleep to sleep; not to, 'tis a sea of? Thus a life, and the law's cowards of of? Thus mome with that is the proubler to sleep: perchan fly takes cowardels beary life; and there's cast give under the us rath a life; and sweary life, or with and more; for inst give have, the himself mind love, by opposin</p>
</div>


</body>
</html>

abduraooft
03-01-2009, 11:29 AM
Validate your markup (http://validator.w3.org/#validate_by_input) and fix the error.
btw, I'd recommend you to check http://bonrouge.com/2c-hf-fluid(r).php to see how to make good 2 column layout.

Blutility
03-01-2009, 05:49 PM
Validate your markup (http://validator.w3.org/#validate_by_input) and fix the error.
btw, I'd recommend you to check http://validator.w3.org/#validate_by_input to see how to make good 2 column layout.

Thanks for the resource, abduraooft. :thumbsup:

I don't know if it was an accident or intentional, but you have linked me to the same website twice.

I fixed the error the website had pointed out, but the problem is still present. I will do as you have advised and attempt to redesign the two columns entirely.

effpeetee
03-01-2009, 06:37 PM
I'd recommend you to check http://validator.w3.org/#validate_by_input to see how to make good 2 column layout.

I think abduraooft means that if you validate by code input, you can alter the code on screen and re-validate it without leaving the validator.

Frank

abduraooft
03-02-2009, 06:58 AM
Oh.. my bad! Ctrl+C didn't work for my second attempt.
The link is http://bonrouge.com/2c-hf-fluid(r).php :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum