Question

我正在使用twitter bootstrap ... 问题是容器宽度不是100％.... 如何使它成为100％.... 这样一切都变得中心对齐了在冷冻箱中，我将容器宽度控制在100％但不是中心对齐的...... 如何解决它...

http://jsfiddle.net/WG7kk/1/embedded/result/

.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
width: 940px;
}


<article class="container" style="margin-top: 25px;">


<div id="landing">
    <div class="container">Purchase Order</div>


    <div class="container" >
        <section>
          <div class="row features" >

            <div id="enhancingWidth" class="span6" >


                <div class="span5 left-box">

                    <div class="control-group">

                        <div class="controls">
                            <input type="text" placeholder="Vendor No" id="c_fdCompanyName" name="bcompanyname" value="" required="required">
                            <label class="error" for="c_fdCompanyName" id="c_fdCompanyName_error"></label>
                        </div>

Answer 1

按照以下示例代码。

    body {
        min-width: 550px;         /* 2 x LC width + RC width */
    }

    #container {
        padding-left: 200px;      /* LC width */
        padding-right: 150px;     /* RC width */
    }

    #container .column {
        position: relative;
        float: left;
    }

    #center {
        width: 100%;
    }

    #left {
        width: 200px;             /* LC width */
        right: 200px;             /* LC width */
        margin-left: -100%;
    }

    #right {
        width: 150px;             /* RC width */
        margin-right: -100%;
    }

    #footer {
        clear: both;
    }

    /*** IE6 Fix ***/
    * html #left {
        left: 150px;              /* RC width */
    }

    /*** Just for Looks ***/

    body {
        margin: 0;
        padding: 0;
        background: #FFF;
    }

    #header, #footer {
        font-size: large;
        text-align: center;
        padding: 0.3em 0;
        background: #999;
    }

    #left {
        background: #66F;
    }

    #center {
        background: #DDD;
    }

    #right {
        background: #F66;
    }

    #container .column {
        padding-top: 1em;
        text-align: justify;
    }



  <div id="container">

    <div id="center" class="column">
        <h1>This is the main content.</h1>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
    </div>

    <div id="left" class="column">
        <h2>This is the left sidebar.</h2>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
    </div>

    <div id="right" class="column">
        <h2>This is the right sidebar.</h2>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
    </div>

</div>

当我使宽度100％时，元素不是中心对齐的

1 个答案: