Frage

The website: http://speelgoedwinkelxl.nl/

I can't get the bottom div aligned in the center

It is the part witch says Meld je aan voor onze nieuwsbrief

I tried to use margin: 0 auto; and text-align: center; but both doesn't work.

The code is from a Magento template but I can't find out why I cant get it centered.

<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>
War es hilfreich?

Lösung

The problem is that your containing div has only span4 which makes it impossible for the inner div to center.

So change that to span12 and remove the custom width. In fact, the complete .ma-footer .social css declarations are not needed.

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

Instead, add width: 500px; to .footer-subscribe.

Andere Tipps

Set float: none; and margin: auto; of element .row-fluid show-grid (where your newsletter is in). Now it has a float: left; and a margin-left: 0;.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top