0
我遇到了本網站正在建設中的問題。我需要一個固定的寬度,以便我可以做margin-left和margin-right auto(居中左窗口上的表單項)。問題是我試圖使這個代碼模塊化,以便它可以與任何未來一起工作我決定創建一個表格,這意味着我需要一個可變高度,這取決於一個表格需要多少個字段。CSS最小高度不會調整背景顏色和邊框
所以爲了澄清上述說明,我試圖保持固定的寬度並且具有可變的高度(使用最小高度)的問題是,背景色和DIV邊界不收縮或與格大小擴大沿着任何想法
該網站是在這裏:?http://traelid.com/news/createNews.php
這裏是我的表單代碼和m ŸCSS代碼:
FORM:
<script type='text/javascript' src='../nicEdit/nicEdit.js'></script>
<script type='text/javascript'>
bkLib.onDomLoaded(function() {nicEditors.allTextAreas() });
</script>
<div class='frmcontainer'>
<div class='title'>TraeLid News</div>
<div class='fill'>
<div class='row'>
<div class='frm lbl'>
<label for='author'>Author:</label>
</div>
<div class='frm itm'>
Auto Author
</div>
</div>
<div class='row'>
<div class='frm lbl'>
<label for='subject'>Subject:</label>
</div>
<div class='frm itm'>
<input class='itm itmtxt' type='text' name='subject' />
</div>
</div>
<div class='row'>
<div class='frm lbl'>
<label for='content'>Content:</label>
</div>
<div class='frm itm txtarea' style='background-color:#fff;'>
<textarea class='itm itmtxtarea ckeditor' name='content'></textarea>
</div>
</div>
<div class='row'>
<div class='frm lbl'>
<label for='tags'>Tags:</label>
</div>
<div class='frm itm'>
<input class='itm itmtxt' type='text' name='tags' />
</div>
</div>
</div>
</div>
CSS:
.frmcontainer
{
text-align:center;
width:750px;
min-height:200px;
margin-left:auto;
margin-right:auto;
border-radius:10px;
border-width:1px;
border-style:solid;
}
.frm
{
margin:5px;
}
.title
{
clear:both;
width:750px;
margin-bottom:24px;
font-size:28px;
font-weight:bold;
text-decoration:underline;
font-variant:small-caps;
}
.row
{
width:750px;
height:auto;
float:left;
clear:both;
}
.lbl
{
font-size:18px;
font-weight:bold;
text-align:left;
height:30px;
width:150px;
float:left;
}
/*Container and input styles*/
.itm
{
text-align:left;
height:25px;
width:580px;
float:left;
}
.itmtxt
{
width:576px;
border-style:solid;
border-width:1px;
}
.txtarea
{
height:400px;
}
.itmtxtarea
{
width:578px;
height:343px;
border-style:solid;
border-width:1px;
}
.nicEdit-panel
{
background-color: #eee;
}
.nicEdit-selected
{
background-color: #fff;
word-wrap:break-word;;
overflow:hidden;
}
.nicEdit-main
{
word-wrap:break-word;
overflow:hidden;
max-height:343px;
}
我能夠解決它的位置:絕對; –
問題是你的浮動,他們不自動調整背景。增加'overflow:hidden;'將會使它計數。這是因爲你沒有身高,無處可切。 – Fewfre
@DavidTorrey夠了;) – Fewfre