Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Mar 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs down Large spacing in IE

    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.

    Code:
    <!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>

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Validate your markup 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.
    Last edited by abduraooft; 03-02-2009 at 06:58 AM. Reason: :(
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Mar 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by abduraooft View Post
    Validate your markup 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.

    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.

  • #4
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    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
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #5
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,852
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Oh.. my bad! Ctrl+C didn't work for my second attempt.
    The link is http://bonrouge.com/2c-hf-fluid(r).php
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •