0

自从我真正处理网页设计中的百分比以来已经有一段时间了。我有一个嵌套的 DIV,它位于容器内,但容器的填充将其推到 100% 宽度之外。不想通过反复试验来了解是什么使它尽可能接近 100% 的宽度,我该如何实现舒适贴合?我还注意到,当我调整窗口大小并缩小空间时,右侧的填充变得更小了。

<div id="block">
    <div class="inside">ssdfsdfdfsfdf</div>
</div>

#block {
    width: 100%;
    background-color: #CCC;
    padding: 20px;
}
.inside {
    height: 200px;
    background-color: #333;
}

http://jsfiddle.net/AndyMP/cs2U9/4/

4

2 回答 2

2

#block 元素使用box-sizingcss 属性。

#block {
    width: 100%;
    background-color: #CCC;
    padding: 20px;

    -o-box-sizing: border-box; /* Opera */
    -ms-box-sizing: border-box; /* IE */
    -moz-box-sizing: border-box; /* Mozilla */
    -webkit-box-sizing: border-box; /* Chrome, Safari */
    box-sizing: border-box;
}

关于 CSS box-sizing 属性:http ://www.w3schools.com/cssref/css3_pr_box-sizing.asp

于 2012-09-06T14:56:10.187 回答
0

我需要一个

overflow: hidden

在容器 DIV 上,以使其完美放置。

http://jsfiddle.net/AndyMP/cs2U9/6/

于 2012-09-06T14:56:18.703 回答