Jak wyśrodkować nagłówki gadżetów?

Chcemy wyśrodkować tytuły gadżetów w naszym menu bocznym. Jak tego dokonać? Nie jest to trudne. Wiemy już jak szukać elementów nagłówków i menu w szablonie zatem przeskakujemy w kodzie HTML bloga (konkretnie w sekcji CSS) do: .sidebar h2, styl tego elementu może wyglądać mniej więcej tak:

.sidebar h2 {

    background: none repeat scroll 0 0 #EEEEEE;

    border-left: 6px solid #E8202D;

    color: #565656;

    font-family: Arial,Helvetica,Sans-serif;

    font-size: 16px;

    font-weight: bold;

    line-height: 16px;

    margin: -11px -11px 12px;

    padding: 10px;

    text-transform: uppercase;

}

kod:

border-left: 6px solid #E8202D;

odpowiada za boczne obramowanie, tutaj zmieniamy grubość i kolor z lewej strony.
Do powyższego stylu dopisujemy jeszcze jedną linijkę:

text-align: center;

zapisujemy zmiany i gotowe. Nagłówki będą wyśrodkowane.

Jeżeli chcemy wyśrodkować cały boczny pas (tytuły i treść) musimy tę samą linijkę dopisać do .sidebar {tutaj będzie styl} lub tuż przed ]]>< dodać to:

#sidebartab1 {
text-align: center;
}

Należy pamiętać, że text-align: center; da się stosować praktycznie wszędzie jednak rozwiązanie dotyczące środkowania tytułów nagłówków dotyczy konkretnie szablonu PrintDesign i jemu pokrewnych. Na pozostałych skórkach (i tych wbudowanych) nagłówki mogą być opisane w inny sposób.

Jeżeli środkowanie jakiegoś elementu nie działa można spróbować wymusić je w ten sposób:

text-align: center !important;

Przejdź do strony wpisu i dodaj komentarz lub pytanie »