• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

wyśrodkowanie tekstu w pionie

0 głosów
427 wizyt
pytanie zadane 8 października 2016 w HTML i CSS przez redstar1 Bywalec (2,110 p.)
<div class="tile_footer" 
style="background:blue; width:100%; height: 36%; position:absolute; top:64%; left:0; right:0; bottom: 0;">

<div style="position:absolute; width:100%; color: white; text-align: center; z-index: 999; font-size: 4vw;">
MILION
</div>

</div>

Mam taki kod wszystko jest ok tylko jak mogę wyśrodkować w pionie napis MILION?

4 odpowiedzi

0 głosów
odpowiedź 8 października 2016 przez Spiral Obywatel (1,310 p.)
edycja 8 października 2016 przez Spiral

Najprościej byłoby ustawić dla diva w którym jest tekst

line-height:X;

Gdzie X jest pożądaną wysokością kontenera w którym ma się owy napis wyśrodkować. Sprawdź to w działaniu (wypróbuj różne wartości).


Jeśli to nie jest wystarczające rozwiązanie to jeszcze flexbox bardzo dobrze sobie z tym radzi.

0 głosów
odpowiedź 8 października 2016 przez skav3n Gaduła (3,540 p.)

Możesz użyć transforma.

div milion {
top: 50%;
transform: translateY(-50%);
}

 

0 głosów
odpowiedź 8 października 2016 przez dewe Gaduła (4,220 p.)
Może spróbuj pokombinować z

padding: 50% 0%;

ewentualnie

display: table-cell;

vertical-align: middle;
0 głosów
odpowiedź 9 października 2016 przez zgrybus Stary wyjadacz (13,620 p.)
display: flex;
justify-content: center;
align-items: center; 

 

Musisz dodać do elementu nadrzędnego :)

komentarz 9 października 2016 przez dewe Gaduła (4,220 p.)
z tego co pamiętam display: flex nie działa na telefonach więc średnie rozwiązanie :P

Podobne pytania

0 głosów
2 odpowiedzi 141 wizyt
+1 głos
3 odpowiedzi 114 wizyt
pytanie zadane 15 listopada 2016 w HTML i CSS przez Dynamic Bywalec (2,390 p.)
0 głosów
2 odpowiedzi 77 wizyt
pytanie zadane 3 sierpnia 2016 w HTML i CSS przez alus152 Bywalec (2,670 p.)
Obowiązuje już zaktualizowany regulamin.

Czy wiesz, że nie musisz już odświeżać strony głównej?

Lista pytań i odpowiedzi aktualizuje się automatycznie!

38,606 zapytań

76,489 odpowiedzi

149,377 komentarzy

18,071 pasjonatów

Przeglądających: 347
Pasjonatów: 30 Gości: 317

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...