多重居中

时间:2011-06-21 19:12:07

标签: css html center

我看了很多这样的帖子,我不知道为什么它不适合我。

.firstCell
{
        float:left;
        width:40%;
    text-align:right;
    align:right;
    border:1px solid white;
}

.cell
{
    float:left;
    width:auto;
    align:left;
    text-align:left;
    border:1px solid white;
}

.newRow
{
    clear:both;
    width:100%;
}

.container
{
        width:100%;
        background-color:#DEEFF8;
        margin:0px auto;
}

所以,我基本上有这个:

<div class="container">
*Within this I have sections of like a form*
        <div style="width:400px;border:1px solid black;">
            <div class='firstCell'>File Name:</div>
            <div class='cell'><html:text property="fileName" /></div>
            <div class='cell' style='color:red;'>(Max 50 character)</div>
            <div class='newRow'></div>
            <div class='firstCell'>Copy Book Name:</div>
                <div class='cell'><html:text property="copyBookName"/></div>
            <div class='newRow'></div>
                <div class='firstCell'><html:button property="populateFields" value="Populate Fields" onclick="showFields();"/></div>
            <div class='newRow'></div>
            <div class='newRow'></div>

        </div>

        *So this is one section, what I would like to happen is to position my form elements in this and then have it all be centered on the main div



</div>

2 个答案:

答案 0 :(得分:1)

你的主要.container有100%的宽度,如果你居中它并不重要,它仍然会从左边开始绘制它。负责左对齐框的内部div没有id / class,你没有对齐它。从技术上讲,你的主要容器是居中的,但它内部的所有东西都是左对齐的。

答案 1 :(得分:0)

你是说这个意思吗? http://jsfiddle.net/36ujG/

有点难以理解你想要集中精力的东西。我所做的就是将margin: 0 auto添加到容器的子div中。