Pozitionare Div copil relativ la Div parinte

[andras]

Tot aici mai am o intrebare: care este modalitatea de baza ca in 2 div-uri imbricate (parinte-copil), div-ul copil sa-si pastreze pozitia relativa fata de div-ul parinte la modificarea rezolutiei browserului? In prezent cind modific rezolutia multe div-uri imbricate (nu e cazul la cele 5) ies in afara div-ului parinte si strica aspectul.

Div-ul parinte sa aibe "position:relative;" sau "positon:absolute;" (sau "fixed", dupa cum il vrei in pagina).
Div-ul copil sa aibe setat "position:relative;" (sau "positon:absolute;") si "width" (daca e necesar si "height") in Procente (%), restul: margin, padding, etc. dupa cum vrei.
Exemplu:

Cod: Selectaţi tot

<style>
#parent {
background: #ededfe;
border: 1px solid #33f;
font-size: 18px;
margin: 5px auto;
padding: 4px 8px;
position: relative;
width: 75%;
}
#child {
background: #b3deb3;
border: 1px solid #333;
border-radius: 9px;
font-size: 18px;
margin: 5px auto;
padding: 5px;
position: relative;
width: 95%;
}
</style>

<div id="parent">Div Parinte, abc, etc. exemplu Div-uri
  <div id="child">Div Copil, 123456778, rand lung pentru test. Abcdefg, ... xyw.<br>
  Alta linie</div>
</div>

Demo:

Div Parinte, abc, etc. exemplu Div-uri

Div Copil, 123456778, rand lung pentru test. Abcdefg, ... xyw.
Alta linie

Da, am aplicat la un div copil si acum functioneaza mult mai bine. Banuiesc ca atunci cind am 2 div-uri copil intr-un div parinte principiul e acelasi. Voi incerca la proxima ocazie.