Przejdź do treści

Jak wyśrodkować tekst w pionie i poziomie CSS? - Kurs HTML i CSS

Jak wyśrodkować tekst w pionie i poziomie CSS?

Aby wyśrodkować tekst zarówno w pionie, jak i poziomie w CSS, można zastosować różne metody w zależności od kontekstu. Jednym z najpopularniejszych sposobów jest użycie właściwości "text-align: center" dla wyśrodkowania w poziomie i line-height oraz height dla wyśrodkowania w pionie. Na przykład: .wysrodkowany-tekst { text-align: center; /* Wyśrodkowanie w poziomie */ height: 200px; /* Wysokość kontenera */ line-height: 200px; /* Wysokość linii równa wysokości kontenera */ }. To spowoduje wyśrodkowanie tekstu zarówno w pionie, jak i poziomie wewnątrz kontenera o wysokości 200 pikseli. Jednak sposób ten będzie działał poprawnie tylko w przypadku tekstu składającego się z jednej linijki. Aby wyśrodkować w pionie element bez względu na jego zawartość, można użyć deklaracji "display: flex; align-items: center" w układzie elastycznym.

Zobacz więcej...

  • CSS
    Pozycjonowanie / Ustawienie {float, vertical-align}

    ...które są bardziej elastyczne i łatwiejsze w użyciu. Flexbox jest szczególnie przydatny do układania elementów w jednym rzędzie lub kolumnie. Jak wyśrodkować tekst w pionie i poziomie CSS? Aby wyśrodkować tekst zarówno w pionie, jak i poziomie w CSS, można zastosować różne metody w zależności od kontekstu. Jednym z najpopularniejszych sposobów jest użycie właściwości "text-align: center" dla wyśrodkowania w poziomie i line-height oraz height dla wyśrodkowania w pionie. Na przykład...

★★★★★ 5/5 (296)

Facebook