Question

如果我有一个div 100px x 100px。

我定义10x子div，它们应该以10px x 10px彼此相邻。

为什么不呢？

使用您的浏览器进行试用：http://dwaves.de/prozentuale-angaben-check.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Statisches Layout</title>
<style type="text/css">
* {
    margin: 0px;
    padding: 0px;
    border: 0px;
}
html,body {
   height: 100%;
   width: 100%;
}
.container {
    width: 100px;
    height: 100px;
    background: red;
    position: absolute;
    left: 0px;
    top: 0px;
}
.relative {
    width: 10%;
    height: 10%;
    background: yellow;
    position: relative;
    float: left;
}
.fixed {
    height: 10px;
    width: 10px;
    background: blue;
    position: relative;
    float: left;
}
</style>
<body>
    <div class="container">
        <div class="relative">
        </div>
        <div class="relative">
        </div>
        <div class="relative">
        </div>
        <div class="relative">
        </div>
        <div class="relative">
        </div>
        <div class="relative">
        </div>
        <div class="fixed">
        </div>
        <div class="fixed">
        </div>
        <div class="fixed">
        </div>
        <div class="fixed">
        </div>
        <div class="fixed">
        </div>
        <div class="fixed">
        </div>
    </div>
</body>
</html>

Answer 1

在您发布的链接中，您有12个，而不是10个<div>元素。此外，您还有一个不必要的<br/>标记。修复这两个问题，它们将适合一行。

JSFiddle demo here（删除了<br>和最后两个<div>代码。）

html div百分比 - 不准确？

1 个答案: