在中间对齐 div 不起作用答案

【问题标题】：Aligning a div in the middle doesn't work在中间对齐 div 不起作用
【发布时间】：2013-10-31 06:42:25
【问题描述】：

我无法让底部 div 居中对齐

这是女巫说的部分 Meld je aan voor onze nieuwsbrief

我尝试使用 margin: 0 auto;和文本对齐：居中；但两者都不起作用。

代码来自 Magento 模板，但我不知道为什么无法将其居中。

<div class="ma-footer-static-container-bottom1">
        <div class="ma-footer-static">
            <div class="row-fluid show-grid">
                <div class="social span4">
<div><div class="footer-subscribe">
    <div class="block-title">
        <strong><span>Meld je aan voor onze nieuwsbrief</span></strong>
    </div>
    <form action="http://speelgoedwinkelxl.nl/newsletter/subscriber/new/" method="post" id="newsletter-validate-detail">
        <div class="newsletter-content">
            <div class="form-subscribe-header">
                <!--<label for="newsletter"></label>-->
            </div>
            <div class="input-box">
               <input type="text" name="email" id="newsletter" title="Meld je aan voor onze nieuwsbrief" class="input-text required-entry validate-email">
            </div>
            <div class="actions">
                <button type="submit" title="Inschrijven" class="button"><span><span></span></span></button>
            </div>
        </div>
    </form>
    <script type="text/javascript">
    //<![CDATA[
        var newsletterSubscriberFormDetail = new VarienForm('newsletter-validate-detail');
    //]]>
    </script>
</div>
</div>
</div>            </div>
        </div>
    </div>

【问题讨论】：

试试这个，在 custom.css 第 92 行设置宽度：1121px；并在 custom.css 第 94 行设置 margin-left: 275px;

标签： html css margin text-alignment text-align

【解决方案1】：

设置 .row-fluid show-grid 元素的 float: none; 和 margin: auto;（您的时事通讯所在的位置）。现在它有一个float: left; 和一个margin-left: 0;。

【讨论】：

我已经添加了它，但它不起作用。我也没有看到 float: left on row-fluid show-grid。

【解决方案2】：

问题是您的包含 div 只有span4，这使得内部 div 无法居中。

因此将其更改为 span12 并删除自定义 width。实际上，不需要完整的.ma-footer .social css 声明。

<div class="social span12">
    ...
</div>

改为将width: 500px; 添加到.footer-subscribe。

【讨论】：