html - How to get rid of tiny gap between floated elements? -


i float 2 divs on html page that: http://5toneface.eu/temp/

(ignore php-warnings). between ruutleft , ruutright div there small gap or white border-like stripe. how rid of it? ruutleft , ruutright divs sides side-to-side exactly?

html is:

<!doctype html> <html lang="et"> <head>      <title>dynamint</title>          <link rel="stylesheet" href="style.css" type="text/css" >     <link rel="stylesheet" href="navistyle.css" type="text/css" >     <script src="script.js" type="text/javascript"></script>  </head> <body> <div id="wrp">  <div id="header"><?php include("includes/header.php"); ?></div>  <div id="container">  <div class="ruutleft">ruutleft</div>  <div class="ruutright">ruutright</div>  <div class="contentleft"><?php include("includes/contentleft.php"); ?></div>   </div> <!-- end container -->   <footer id="footertop"><?php include("includes/footer.php"); ?></footer>  <!--   siia tuleb veel footerbottom  -->  <footer id="footerbottom">   <p id="bottomp">&copy; 2015 waht? m&ouml&oumlbel. rights         reserved</p> </div> </div> <!--end wrp -->  </body> </html> 

and css pretty simple:

* {             margin: 0;    padding: 0;   }  body {   font-family: calibri light, georgia, verdana, arial;   background-color: #edeff0;   font-size: 105%;   color: #303030;   line-height: 1.4;   margin: 0;     }  #wrp {    width: 100%;    margin-left: auto;    margin-right: auto; }  #header {   width: 100%;   height: 96px;   position: fixed;   top: 0px;   background-color: #fff; }  #logo {   float: left;   margin: 2% 0 0 5%;   }  #container{   width: 100%;   height: auto;   margin-top: 0;   background-color: #edeff0; }  .ruutleft {   width: 40%;   height: 320px;   margin-left: 10%;   margin-top: 145px;   background-color: #8ac0ca;   float: left; }  .ruutright {   width: 40%;   height: 320px;   margin-right: 10%;   margin-top: 145px;   background-color: #cccbc9;   float: right; }    .contentleft {     width: 80%;     margin-left: auto;     margin-right: auto;     min-height: 400px;     padding: 1% 1% 4% 1%;     font-size: 95%;     height: auto;     } 

float both elements left.

change .ruutright float:left - fix issue.


Comments

Popular posts from this blog

OpenCV OpenCL: Convert Mat to Bitmap in JNI Layer for Android -

android - org.xmlpull.v1.XmlPullParserException: expected: START_TAG {http://schemas.xmlsoap.org/soap/envelope/}Envelope -

python - How to remove the Xframe Options header in django? -