Wie kann ich den Inhalt eines div zentrieren?

Question

<div class="sc-content-footer container"> 
<div class="row"> 
<div class="col-md-4"> 
<!-- Begin MailChimp Signup Form --> 
</div> 

<div class="col-md-4"> 
<img src="images/BSY_LOGO_SIGNAGE.png"> 
</div> 

<div class="col-md-4"> 
<!-- Begin MailChimp Signup Form --> 
</div> 

Nichts scheint, text-align zu arbeiten: center nichts tut. Der Inhalt in den 3 divs ist: MailChimp Form, Logo, MailChimp Form

Answer 1

... Ich wünschte, ich, bevor er fragte hier ein wenig mehr Zeit verbracht hatte. Ich entschuldige mich bei allen, ich bin neu im Webdesign und ich wurde frustriert. Wird nicht noch einmal passieren.

Das Problem war Mailchimp benutzerdefinierte CSS. Ich habe die CSS-Stylesheet-Importe aus dem HTML-Formular entfernt und den Textfeldern und Schaltflächen Bootstrap-Klassen hinzugefügt. Jetzt ist alles in Ordnung und Dandy.

Answer 2

in CSS die äußere DIV hat:

Position: relative;

und innere DIV haben

Position: relative; Rand: 0 automatisch;

versuchen Sie dies, das ist die richtige Form.

Answer 3

text-align: center funktioniert nur, wenn das auszurichtende Element display: inline-block hat.

Auch text-align: center ist nicht auf dem Element, das Sie ausrichten, sondern auf dem übergeordneten Element des Elements, das Sie ausrichten.

.inner { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: red; 
 
    display: inline-block; 
 
} 
 

 
.outer { 
 
    blackground-color: yellow; 
 
    width: 100%; 
 
    text-align: center; 
 
}

<div class="outer"> 
 
<div class="inner"> 
 

 
</div> 
 
</div>

Answer 4

Es wird schwierig, wenn die <div> Tags verschachtelt sind, aber bitte versuchen:

.container 
{   
    width: 50%; 
    margin: 0 auto; 
} 

.row 
{ 
    display: inline-block; 
    text-align: center; 
} 

Answer 5

Da Sie Bootstrap verwenden, können Sie einfach eine Bootstrap-Klasse (Textcenter) verwenden, um den Inhalt div mittig auszurichten.

bearbeiten Ihren Code so etwas wie dieses:

<div class="sc-content-footer container text-center"> 
<div class="row"> 
<div class="col-md-4"> 
<!-- Begin MailChimp Signup Form --> 
</div> 

<div class="col-md-4"> 
<img src="images/BSY_LOGO_SIGNAGE.png"> 
</div> 

<div class="col-md-4"> 
<!-- Begin MailChimp Signup Form --> 
</div> 
</div> 
</div> 

Sie können auch den Text-Center-Klasse in den Kindern setzen div wenn Sie noch Probleme nach dem Ausführen des obigen Codes mit.