iPhone boyutundaki aygıtlara h2 nasıl sığar

Question

Bu sorunu iPhone boyutundaki aygıtlarda h2 ile aldım. Kod iyi görünse de h2 merkezden çıkıyor. Neden olduğunu anlayamıyorum.

/* for iPhone-sized devices */ @media only screen and (max-device-width: 480px) { 
.container { width: auto } 
body { padding: 0 } 
h1 { font-size: 1.5em; margin-bottom: 3em; text-align: left } 
h2 { font-size: 2em; margin-bottom: 1.5em; text-align: center } 
h3 { font-size: 1.8em } 
h6 { font-size: 1em; text-align: left } 
p { 
    font-size: 1.2em; 
    line-height: 1.4em; 
} 

Benim sitesidir: mamufka.com

h2 off center

İşte benim kod.

Deneyimli sizden bazı ipuçlarını duymak isterim!

Answer 1

h2 öğeniz üzerinde genel bir kural var; bu, kenar boşluklarının merkezi olarak hizalanmadan önce kenarlarla çarpmasına neden oluyor.

@media only screen and (max-device-width: 480px) { 
h2 { font-size: 2em; margin: 0 0 1.5em 0; text-align: center } 
} 

Answer 2

h2

h2 { font-size: 2em; margin: 0 0 1.5em; text-align: center } 

Answer 3

sağ/sol kenar boşluğu kaldırın bana oldukça iyi görünüyor, ancak yatay hizalanmış yapmak istiyorsanız, kenar boşluklarını kaldırmak olmalıdır:

bu deneyin soldan ve sağdan: Bu metin aslında boşluktan daha büyüktür Bu marj nedeniyle onları e.

Answer 4

Marjı @media sorgularında azaltın. Bunun gibi:

@media only screen and (max-device-width: 480px){ 
    h2 { 
     margin: 2em 0em 0 0em; 
     font-size: 2em; 
     margin-bottom: 1.5em; 
     text-align: center; 
    } 
}