由于已经给出了最小高度,因此箱子不会高度扩展

时间:2011-02-08 04:40:28

标签: css

我的课程就是这样,在给出最小高度时动态扩展div。我可以知道这有什么问题。

.gil_Individual_FormPanelBg
{   
    width:500px;
    min-height:50px !Important;
    float:none;
    margin:5px auto;
    padding:4px;
    background-color:#f7f7f7;
    border:Solid 1px #e6e6e6;
    -border-radius:4px 4px 4px 4px;
    -Moz-border-radius:4px 4px 4px 4px;
    -webkit-border-radius:4px 4px 4px 4px;
}

1 个答案:

答案 0 :(得分:0)

Shabir,看起来好像你有一堆float:left的时候没有必要。

试试更新的CSS

.gil_Individual_FormPanelBg
{    
    width:500px;
    min-height:50px;
    margin:5px auto;
    padding:4px;
    background-color:#f7f7f7;
    border:Solid 1px #e6e6e6;
    -border-radius:4px 4px 4px 4px;
    -Moz-border-radius:4px 4px 4px 4px;
    -webkit-border-radius:4px 4px 4px 4px;
}

.gil_Individual_FormWrapper
{
    position:relative;
    height:auto;
    width:100%;    
    margin:2px auto;
    padding:0px;
}

.gil_Individual_FormRow
{
    position:relative;
    width:100%;
    min-height:20px !Important;
    margin:3px 0 0 0;
    padding:0px;
}

.gil_Individual_FormLable
{
    position:relative;
    width:150px;
    height:15px;
    float:left;
    margin:0px;
    padding:0px;
    font-family:'Helvetica', 'Arial', 'Sans-Serif';
    font-size:11px;
    font-weight:Normal;
    color:#3B5998;
    text-align:left;
    text-decoration:none;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
}

.gil_Individual_FormCtrl
{
    position:relative;
    width:350px;
    min-height:15px !Important;
    float:left;
    margin:0px;
    padding:0px;
    font-family:'Helvetica', 'Arial', 'Sans-Serif';
    font-size:11px;
    font-weight:Normal;
    color:#333;
    text-align:left;
    text-decoration:none;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
}

HTML保持不变。如果要添加类float。考虑在浮动DIV之后创建一个清晰的类。

这样的类:

.clear{
    clear:both;
    margin:0;
    padding:0;
    height:1px;
}

在查看了您发布的链接之后,看起来您的构建可能过于复杂,但希望它应该按您希望的方式运行。