We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 26074
    • 121 Posts
    This code work correctly in firefox, opera, chrome, but not in internet explorer.
    The margin bottom of 10px is not visualizated.
    Is a bug?
    If yes, is there a hack to solve the problem?

    CSS
    body, div, p, h1 {
    margin:0; 
    padding:0; 
    border:0;
    }
    
    body {
    background-color:#000033;
    color:#FFFFFF;
    text-align:center;
    }
    
    #wrapper {
    width:980px;
    margin:10px auto;
    text-align:left;
    background-color:#FFFFFF;
    color:#000000;
    }
    
    #content {
    width:980px;
    text-align:left;
    }
    


    HTML
    <!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>Template</title>
    	<link rel="stylesheet" type="text/css" href="css/stile.css" media="screen" />
    </head>
    <body>
    	<div id="wrapper">
    	
    		<div id="content">
    
    			<h1>Consequuntur eum necessitatibus</h1>
    			<p>Quaerat incidunt quaerat nesciunt, pariatur repellendus deserunt, tempor quae rem nulla mollitia corrupti, esse ipsum voluptatibus laborum, ea sapiente cupiditate nesciunt. Libero facere. Exercitationem unde, distinctio similique laborum; ut eiusmod adipisci cum assumenda quam. Sunt asperiores explicabo deserunt, dolor sequi saepe eveniet, delectus veniam quibusdam officia; beatae quisquam. Quae corporis voluptas cum laboriosam, rem maiores, vero tempor fugit unde aut, magnam at, nobis praesentium, nobis ratione magni. Tempore eligendi ut quisquam hic nihil aliquid molestiae; aliqua minus necessitatibus doloremque maiores similique aspernatur reiciendis; eiusmod similique repellendus magnam. Fuga eveniet velit voluptate assumenda iusto. Suscipit iste, iusto tenetur similique officiis accusamus; minus nobis sed ratione ducimus nulla, numquam adipisicing nostrum officiis nostrum deserunt quibusdam sed, nulla consequuntur tenetur minima autem, dolore fugit id doloremque, laborum provident, cum possimus corrupti omnis distinctio. Odit laborum tempore voluptatum lorem delectus molestias earum, excepturi fugit nihil. Similique ab nemo odio temporibus ullam similique, elit aperiam qui ullam harum voluptas repellat. Quaerat consequuntur. Nostrum aliquam, aliquam autem vel, omnis rem perferendis maxime, optio dolorem maxime animi, a dolorem incididunt sint. Doloremque harum, voluptate provident; consequatur magni adipisicing magni; dolorum nemo, corrupti molestiae alias odit. Veritatis doloribus fugiat, doloremque inventore; assumenda nam rerum, blanditiis eaque. Enim perferendis veritatis ad, magna do dolorem ad praesentium illum velit molestiae minima; minus neque, magni optio ab impedit doloremque elit. Architecto exercitationem qui neque maiores eligendi exercitationem explicabo, impedit pariatur nulla molestias consectetur obcaecati unde dolorem, sed beatae rem facere voluptas quisquam exercitationem; ipsum magnam velit hic dolorum impedit repellendus voluptatum. Incidunt voluptates accusamus odio dolorum, consequuntur animi, magnam ducimus repudiandae. Aut ipsa aliquid delectus beatae eos voluptas ratione inventore; velit quasi? Quos itaque. Modi animi eius tenetur tempore qui; amet minima sunt sapiente omnis cumque; maiores voluptate magnam assumenda minima maiores delectus provident, elit et adipisicing. Sed elit minus sunt, ducimus quae accusamus tempore, ipsam maxime nostrum; molestias dolores. Quae assumenda provident, mollitia harum id sed, ratione voluptatem deleniti, quod odio ex ut praesentium odit quam, debitis beatae sapiente est praesentium; reiciendis aliquam sunt aliquid tempora delectus, quos non vero corrupti lorem illum facere earum, nulla maiores accusantium cumque, minus distinctio sunt iste corporis officia, voluptatem reprehenderit incididunt quis? Aliquam sed fugit sequi, at fuga voluptatibus. Excepturi aliquid accusamus, possimus natus exercitationem, accusantium ratione cupiditate aliqua molestiae. Dignissimos reiciendis, magnam debitis? Dolorum animi placeat incidunt dolore asperiores, aut modi incidunt ad eos; magni ea illo, assumenda lorem, aliquam ipsam dolorem.</p>
    			<h1>Porro adipisci quaerat</h1>
    			<p>Cupiditate fuga veritatis, ullam aliquid dolor dolores, nulla omnis vitae culpa tenetur architecto fugiat tempore reiciendis eius, ipsum aperiam voluptatum, veniam adipisicing dolorem ex enim iste numquam nam rem incidunt, ipsa et numquam mollitia laborum et repellat, pariatur corporis voluptates ipsam harum. Voluptatum quidem; voluptatum dolor culpa, necessitatibus nam maiores, aliquam minus dignissimos, doloribus sint repellendus, molestiae fuga accusantium; voluptatibus libero. Esse cumque, temporibus excepturi, unde ipsum? Sed optio aliquam quos; corrupti veritatis, laboriosam eiusmod eius quod dolorem, natus corporis debitis recusandae. Quis asperiores odio inventore? Magni nisi in dignissimos, dolores elit est ratione saepe, iusto incididunt, quae nesciunt eaque? Quam id in aliqua, lorem aspernatur odio consequuntur debitis quaerat? Molestias ut ipsa eligendi, architecto porro perferendis. Iste sapiente, in quidem ad. Labore at id praesentium a ipsam. Facilis aut porro laboriosam, laboriosam iste voluptas necessitatibus facere, eaque labore eum debitis expedita non, soluta aliquam assumenda incididunt adipisci tempora, culpa nisi voluptates ducimus sequi ipsum quibusdam repellendus, voluptatem magnam eius. Incididunt non impedit facere tempor, fugiat aliquid veritatis incididunt doloremque alias lorem; animi magna tenetur cum suscipit omnis necessitatibus praesentium, do dolorem ex, corporis molestiae, porro ipsa omnis suscipit vitae ullam nostrum totam; eveniet incidunt temporibus laborum explicabo quisquam quas commodi magnam. Animi dicta, aliqua accusantium perferendis minus. Nesciunt laborum optio repellat fuga repellat fugit recusandae, ea optio totam sapiente ducimus molestias fugit consectetur; ex dolore lorem quod maiores, aut voluptatibus beatae necessitatibus voluptas distinctio soluta. Exercitationem eiusmod placeat itaque adipisicing numquam repudiandae, reprehenderit ad tempora libero iusto inventore, vitae quia illum velit illo quo quibusdam do debitis, quibusdam delectus lorem obcaecati facere. Iure error officia assumenda natus sapiente. Voluptates repellendus, adipisci minima elit, nemo nisi, nemo eius; voluptatibus dolorem. Amet nobis reprehenderit incidunt, praesentium beatae doloremque voluptatum; consequuntur officia ut fugit, eum facilis magna nesciunt, quae odio, voluptatibus blanditiis adipisci. Cum nostrum modi dolores odit sapiente atque, autem sit cumque quia ut enim? Officiis architecto nemo cum quis; dolor dolor soluta eveniet architecto vitae facilis, architecto sunt illum, voluptatem asperiores perspiciatis, esse dolorum; ratione recusandae, atque suscipit nostrum accusantium, quas sint, explicabo incidunt doloribus repellendus doloribus? Enim est voluptates asperiores doloribus, ipsam soluta, deleniti consectetur ad, adipisicing corporis voluptatum cumque eum; cupiditate necessitatibus consectetur quo, tenetur magna libero est. Saepe odit, iure nam porro; eiusmod debitis saepe, commodi sequi, sed doloremque, in placeat. Natus repudiandae, facilis quod fuga laborum corrupti quos? Minus magni, saepe ullam molestiae, cupiditate nam.</p>
    		</div>
    	</div>
    </body>
    </html>
    
      ___________________________________________________________________
      ..:: Samuele ::..
      • 26931
      • 2,314 Posts
      Hi there,

      i realized that as well, don’t know if it’s a bug...

      but you could give a padding to the body and take out the margin...

      body {
      background-color:#000033;
      color:#FFFFFF;
      text-align:center;
      padding:10px 0px; 
      }
      
      #wrapper {
      width:980px;
      margin:0px auto;
      text-align:left;
      background-color:#FFFFFF;
      color:#000000;
      }

      tested in IE6/7 and FF2/3

      cheers, j
        • 26074
        • 121 Posts
        Thanks! smiley
        It was so simple shocked
          ___________________________________________________________________
          ..:: Samuele ::..