0

浏览了一些相关问题,但似乎没有一个能回答我的问题。

我有以下内容:

<div id="outerdiv" style="width: 50%; height: 100%">
    <div id="innerdiv" style="margin: 5px; height: 100%">
         <textbox>
    </div>
</div>

我希望文本框占据有边距的内部 div 的全部空间。两个问题:

如果内部 div 的高度为 100%,它会溢出,因为它有边距。我不能在外部 div 上进行填充,因为外部 div 然后溢出它的父级等。整个布局是一个正方形,有四个相等的子正方形,每个子正方形就像上面的标记。

  1. 那么我怎样才能让 innerdiv 占据整个高度但仍然有我想要的边距?

如果我将文本框设置为 100% 的宽度和高度,边距会再次导致问题并且文本框溢出。

  1. 如何让文本框占据整个空间而不会溢出?

编辑

小提琴:使用它作为基础并添加一个具有固定宽度和高度的外部 div 来查看我的问题:http: //jsfiddle.net/7w8TA/

这是我自己创建的小提琴,但我不确定它是否公开......:http: //jsfiddle.net/LethalLava/mY6Dn/

4

1 回答 1

1

希望这可以帮助你:http: //jsfiddle.net/7w8TA/

<div style="width:400px; height:300px">
<div id="outerdiv" style="width: 50%; height: 100%;border:1px solid black" >
    <div id="innerdiv" style="margin: 5px; height: 100%;border:1px solid red" >
        <input type="text" value="textbox" style="width:98%" />
    </div>
</div>

http://jsfiddle.net/mY6Dn/4/

于 2012-11-23T09:49:45.313 回答