Question

我想在html页面上浮动两个div：http://5toneface.eu/temp/

（忽略php-warnings）。但是在ruutLeft和ruutRight div之间有一个小间隙或白色边框状条纹。如何摆脱它？因此，ruutLeft和ruutRight divs两侧将是完全一对一的？

html是：

<!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 by WAHT? m&ouml&oumlbel. All rights         reserved</p>
</div>
</div> <!--end wrp -->

</body>
</html>

和css也非常简单：

* {         
   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;   
 }

Answer 1

浮动你的元素left。

将.ruutRight更改为float:left - 这样可以解决问题。

如何摆脱浮动元素之间的微小差距？

1 个答案: