[koch4m_cie]

#css #webdev

słuchajcie no, mam , który wypełniam jakimś background i dodaje NAPIS
=====

.

Co wpisać w css, żeby ten NAPIS
=====

wyśrodkować na tle całego div? tutaj będzie trzeba coś pokombinować z margin i padding?

[f.....r]

@koch4m_cie: center heh

[mike_oldfield]

@fatslimpiotr: margin: 0 auto;

[ufo99]

@koch4m_cie: marginy na auto - zwykle działa.

[koch4m_cie]

@mike_oldfield: @ufo99:

MOVE. REST. RECOVER. MOVE.
--------------------------

.feature {
background: url(https://s3.amazonaws.com/codecademy-content/projects/move/feature.jpg);
height: 600px;
}

.feature h2 {
color: #fff;
font-size: 40px;
margin: auto;
}

[OFman]

@koch4m_cie: Jeśli nie zdefiniujesz szerokości to domyślnie będzie mieć szerokość 100% więc próba wyśrodkowania elementu nic nie da, tekst dalej będzie po lewej. Daj text-align:center;
===========================================================================================================================================

[koch4m_cie]

@OFman:



MOVE. REST. RECOVER. MOVE.
--------------------------

.feature h2 {
text-align: center;
color: #fff;
font-size: 40px;
margin: 0px auto;
}

dalej to samo....

[koch4m_cie]

@mike_oldfield: @ufo99: up, patrzcie

[OFman]

@koch4m_cie: Ah bo Ty chcesz to też wyśrodkować pionowo. Spróbuj dodać w stylach vertical-align:middle; ale nie jestem pewny czy to pomoże.

[epi]

@koch4m_cie: https://css-tricks.com/centering-css-complete-guide/

[mike_oldfield]

@koch4m_cie: tobie chodzi o vertykalne wycentrowanie?
mogłeś napisać od razu....

[rotto]

@koch4m_cie: daj div'a position: relative; i:

h2{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}

[facefear]

.feature{
position: relative;
}
h2 {
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%);
transform: translateY(-50%);
}

[rotto]

@mike_oldfield: nieśpiębo?

[rotto]

@facefear: imho to nie zadziala, bo transform zostanie nappisany i zotanie tylko translateY

[koch4m_cie]

@facefear: zadziałało xD
@rotto:

[rotto]

@koch4m_cie: No nie miało innego wyjścia :D