css jak wyśrodkować tekst w DIVach?

[micesz229 0]

Witam

 

jak zrobić?

vertical-align: middle;

tak aby cały text we wszystkich divach

<p>text</p>

był po środku

 

 

 

Gdy dałem tak to działa...

p {
      text-align: center;
      vertical-align:middle;
    /*  padding: 1px 1px 1px 1px;   /* top/right/bottom/left */
      margin-left: auto;
   margin-right: auto;
      position: relative;
      top: 50%;
      transform: translate(0, -50%);


   }

Edytowane 13 Maja 2019 przez micesz229

[kretowicz 0]

Np. https://vanseodesign.com/css/vertical-centering/

 

Tego jest tyle, że już w tysiącach można liczyć. Szukałeś w google?

[Snicers 0]

A więc tak, sposobów na wyrównanie elementu rodzica jest kilka ale wydaję mi się że najłatwiejszym do opanowania jest użycie po prostu flexa.

 

Sposób # 1

 

display: flex;

justify-content: center;

align-items: center; - to spowoduję ze każdy element w rodzicu będzie wyśrodkowany na osi y więc możesz też dać bezpośrednio na element który chcesz wyśrodkować => align-self: center;

 

Sposób # 2

 

position: relative; <= rodzic elementu

position: absolute; <= dziecko

top: 50%;

left: 50%;

transform: translate(-50%,-50%);

 

Sposób # 3

 

line-height: wysokość elementu rodzica

 

Moim zdaniem te sposoby, które wymieniłem są najłatwiejsze do ogarnięcia. Jak czegoś nie wiesz to pytaj

Edytowane 17 Maja 2019 przez Snicers