css – 使div保持在带有边距的父div中

我一直在寻找解决这个问题,我没有看到一个很好的答案,为什么会发生这种情况,以及我如何解决它.. 基本上我有一个div,我设置为100％的宽度和高度,在里面我有一个像一个broswer标签部分,我添加

... . . 我一直在寻找解决这个问题,我没有看到一个很好的答案,为什么会发生这种情况,以及我如何解决它..
基本上我有一个div,我设置为100％的宽度和高度,在里面我有一个像一个broswer标签部分,我添加一个边距和填充到主要区域,当我设置标签div为全宽它粘一些像素,什么是正确的方式来处理与％s和边距/填充玩耍时伸出父母div的子div

<div class="appview_fullscreen app_ama"> <center><strong>AMAMAMAMAMAMA</strong> </br>    <i>AMAMAMA</i> </center><div class="main_area">    <div class="tabs_area">    </div>    <div class="main_window">    </div>    <div class="troubleshoot_area">    </div>    <div class="timeline">    </div> </div></div>.appview_fullscreen{    width: 100% !important;    height: 100%;    background-color: black;    color: white;    font-size: 20px;    margin: 0px;}.app_ama{}.main_area{    border: 1px solid green;    width: 100%;    padding: 2px;    margin: 0px;}.tabs_area{    border: 1px solid green;    height: 20px;    width: 100%;}

演示：http://jsfiddle.net/S8RC3/

.

解决方法

. 只需从DIV元素中删除100％即可.

DEMO

.main_area{    /* width:100%; Why? I'm a DIV! */    border: 1px solid green;    padding: 2px;    margin: 0px;}.tabs_area{    /* width:100%; Why? I'm a DIV! */    border: 1px solid green;    height: 20px;}

作为块级元素的DIV已经很宽,因为它是父容器.

另外你有一个拼写错误：< / br>应该是< br />,< br />或者< br>

. . .. ...