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

wyśrodkowanie tekstu w pionie

VPS Starter Arubacloud
0 głosów
12,042 wizyt
pytanie zadane 8 października 2016 w HTML i CSS przez redstar1 Bywalec (2,200 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,330 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,900 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,300 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 Pasjonat (24,860 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,300 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 1,660 wizyt
+1 głos
3 odpowiedzi 1,341 wizyt
pytanie zadane 15 listopada 2016 w HTML i CSS przez Dynamic Bywalec (2,910 p.)
0 głosów
2 odpowiedzi 1,151 wizyt
pytanie zadane 3 sierpnia 2016 w HTML i CSS przez alus152 Bywalec (2,690 p.)

92,452 zapytań

141,262 odpowiedzi

319,077 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

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

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...