2016-03-22 10 views
2

Ich habe einen einfachen Abschnitt, den ich unter meiner Fußzeile verwende. In meiner Medienabfrage 640px oder weniger werden die beiden Zeilen nicht mit text-align: center hinzugefügt. Ich habe auch versucht margin: 0 auto, aber das hat auch nicht für mich funktioniert.Element zentriert nicht mit Textausrichtung: Mittelpunkt hinzugefügt

Warum sind diese beiden Absätze nicht zentriert? Das ist so einfach, aber ich verpasse gerade etwas.

#copyright { 
 
\t width: 100%; 
 
\t /*padding: 10px 10%;*/ 
 
\t color: #999999; 
 
\t background: #1B1B1B; 
 
\t font-family: Verdana, Geneva, sans-serif; 
 
\t position: relative; 
 
\t clear: both; 
 
} 
 
#copyright a { 
 
\t color: #999999; 
 
} 
 
#copyright_left { 
 
\t float: left; 
 
\t text-align: left; 
 
\t margin-left: 10%; 
 
} 
 
#copyright_right { 
 
\t float: right; 
 
\t margin-right: 10%; 
 
} 
 

 
/*----------------------------------------------PHONE MEDIA QUERY 640--------------------------------------------*/ 
 

 
@media screen and (max-width:640px) { 
 
/*---Copy Right ---*/ 
 
#copyright { 
 
\t font-size: .9em; 
 
    text-align: center; 
 
} 
 
#copyright_left { 
 
\t text-align: center; 
 
} 
 
#copyright_right { 
 
\t text-align: center; 
 
} 
 
}
<div id="copyright"> 
 
    <p id="copyright_left">&copy; 2016 -All Rights Reserved- <a href="index.php">EquipmentInsider.com</a></p> 
 
    <p id="copyright_right"><a href="About-us.php">About Us</a> | <a href="Contact-us.php">Contact</a> | <a href="Terms-of-Agreement.php">Terms of Agreement</a></p> 
 

 
    <br class="clear" /> 
 
    </div>

Antwort

1

Sie haben Float in Ihrem Haupt-CSS gegeben, so in reaktionsschnellen CSS müssen Sie den Schwimmer deaktivieren, weil mit Float text-align:center und margin:0 auto nicht funktioniert. Schau unter css

@media screen and (max-width:640px) { 
/*---Copy Right ---*/ 
#copyright { 
    font-size: .9em; 
    text-align: center; 
} 
#copyright_left { 
    text-align: center; 
    float:none; 
} 
#copyright_right { 
    text-align: center; 
    float:none; 
} 
} 
+0

Hält 'float: none' Rand oder Höhe weg? Ich bekomme jetzt einen Leerraum über diesem Abschnitt. – Becky

+0

no 'float: none' wirkt nicht auf Rand oder Höhe Es muss ein anderes Problem geben Können Sie bitte Screenshot oder Geige teilen, um es herauszufinden –

+0

Fotos zu meiner Frage hinzugefügt. – Becky

1

Scheint Sie yout schwimmt auf none gesetzt fehlen. Wenn es immer noch nicht zentriert ist, versuchen Sie, nach anderen CSS zu suchen, die Ihre Medienabfragedeklarationen überschreiben.

Edit: das gleiche gilt für Sie Margen.

+0

Es ist verrückt, wie vermisse solche einfachen Dinge, wenn ich so müde bin. Aus irgendeinem Grund brachte das die Div ein bisschen nach unten. Irgendeine Idee warum? – Becky

+0

Schwebende Elemente verändern die Anordnung der Elemente. Yout br Element räumt nicht mehr auf, weil es keine gibt. Das könnte die Ursache sein. – Scorer