SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    an Ie issue i just cant spot

    Hi there,

    This is an IE issue. I cant spot what it is in my code but there is an extra space between my div's horizontally. It looks to be about 10px

    I want the spacing to be the same as ive spaced my boxes vertically which has about 3-5px between them.

    ( im sorry id post images but im on a machine without an image editor and the files are too big to upload at the mo)

    Heres the relevant code:

    Code:
    /*containers*/
    
    
    body {
    text-align : center;
    font-family : "trebuchet ms" Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    }
    
    #header {
    top : 3px;
    left : 0;
    padding-bottom: 5px;
    }
    
    #container {
    width: 889px;
    margin : 10px auto;
    text-align : left;
    }
    
    #maincontainer {
    width: 675px;
    float: right;
    }
    
    
    
    
    /*boxes*/
    
    
    #topbox { 
    
    Background: transparent url(topbox.gif) no-repeat;
    width: 100%;
    height: 200px;
    }
    
    #box1left { 
    border: 4px solid #869db7;
    float: left;
    width: 443px;
    margin-top: 5px;
    }
    
    #box1left div {
    float: left;
    width: 200px;
    padding-left: 6px;
    }
    
    #box1leftfloating {
    float: right;
    margin-left: 17px;
    width: 180px;
    margin-right: 0px;
    margin-top: 15px;
    }
    
    #box2left {
    border: 4px solid #d3c1b1;
    float: left;
    width: 443px;
    margin-top: 5px;
    }           
    
    #box2left div {
     padding: 6px;
    }
    
    #box1right {
    background-color: #dece1b;
    float: right;
    width: 218px;
    padding-bottom: 20px;
    margin-top: 5px;
    }           
    #box1right div {
    padding: 6px;}
    
    #box2right {
    border: 4px solid #869db7;
    float: right;
    clear: right;width: 210px;
    margin-top: 5px;}            
    
    #box2right div {padding: 6px;}
    
    /*sidebar*/
    
    #sidebar2 div {
    padding: 6px;
    }
    
    #sidebar2 {
     border: 4px solid #d3c1b1;
    width: 200px;
    w/idth: 220px;
    margin-top: 5px;
    }
    
    #sidebar3 {border: 4px solid #a2453e;
    width: 200px;
    margin-top: 5px;
    }
    
    #sidebar3 div {
    padding: 6px;
    }
    
    
    /*image replacement classes*/
    
    
    span.leftbox1 { 
    background: transparent url(propertytitle.gif) no-repeat;
    position: absolute;
    top: 0;
    left:0;
    margin-top: 0px;
    width: 300px;
    height: 30px;
    z-index: 1;
    }
    and the html:
    Code:
    <?xml version="1.0" encoding="utf-8"?>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>solutions4 Letting&amp;Estates Ltd</title>
      <link rel="stylesheet" href="<txp:css />"  type="text/css" />
    </head>
    
    <body id="home_page">
      <div id="container">
    <div id="header">
    <img src="textpattern/header.gif" alt="welcome to solutions4 letting and estates" />
     </div>    
    
    <div id="maincontainer">      
    <div id="nav"><a id="home" href="home.html" name="home">Home</a>
     <a id="about" href="http://www.rightmove.co.uk/forrent/23084" name="about">Homes for let</a>
     <a id="work" href="http://www.rightmove.co.uk/forsale/16332" name="work">Homes for sale</a>
     <a id="contact" href="contact.html" name="contact">contact</a>
    </div>      
    
    <div id="topbox">
    </div>      
    
    <div id="box1left">        
    
    <h1>property of the month<span class="leftbox1"></span></h1>        
    
    <div>          
    <p>Whether you want to buy,sell or Let a property we have the Solution for you. If you're interested in seeing our Properties for sale or Let please use the links above to take you to rightmove.co.uk where we advetise all our properties. If you're a Landlord and have property to Let then please take a look at the services solutions 4 offer. If you'd like to contact us please use the contact page where you can find all of our details.</p>        
    </div>        
    
    <div id="box1leftfloating">        	
    <img src="textpattern/solutions4mockup.gif"/>        	
    <img src="textpattern/solutions4mockup1.gif"/>        	        
    </div>      
    </div>            
    
    <div id="box1right">
    <h1>Houses<span class="rightbox1"></span></h1>
     <div>          
    <p class="white">Properties for sale or Let please use the links above to take you to rightmove.co.uk where we advetise all our properties. If you're a Landlord and have property to Let then please take a look at the yes we doi have a four bedrrom property in cuddoth. Yes its 495 a month. noservices solutions 4 offer</p>
    </div>
    </div>      
    
    <div id="box2left"><h1>Houses<span class="leftboxbottom"></span></h1>                
    <div><p>Whether you want you  you  to buy,sell or Let a property we have the Solution for you. If you're interested in seeing our Properties for sale or Let please use the links above to take you to rightmove.co.uk where we advetise all our properties. If you're a Landlord and have property to Let then please take a look at the services solutions 4 offer. If you'd like to contact us</p>
    </div>
    </div>      
    
    <div id="box2right"><h1>Houses<span class="rightbox2"></span></h1>                
    <div><p>Whether you want to buy,sell or Let a property we have the Solution for you. Blah Blah houses and apartments houses and shops shopping staff offices sending fexesIf you're interested in seeing our Properties for sale or Let please use the links above to take you to rightmove.co.uk where we advetise all our properties. If you're a Landlord and have property to Let then please take a look at the services solutions 4 offer. If you'd like to contact us please use the contact page where you can find all of our details.</p>
    </div>
    </div>
    </div>

  2. #2
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First of all you need to remove this:

    Code:
    <?xml version="1.0" encoding="utf-8"?>
    because it puts IE into quirks (broken box model) mode.

  3. #3
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Tyssen!

    Yes that was it. I didnt even know that was there. My text editor, skedit, must have put that there when i started the document.

    You said 'first of all' Is there something else you think needs doing?!

    Thanks for your help!

  4. #4
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well I couldn't say for certain that would fix your problem but that needed to be done first before looking at anything else.

  5. #5
    SitePoint Wizard
    Join Date
    Oct 2005
    Location
    London
    Posts
    1,678
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok great i just wanted to make sure you didnt think my code was wrong in some other way!

    Thanks


Bookmarks

Posting Permissions

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