HTML, Div, Clear:left, right, both Hogyan is?
Képen látható, hogy a header (legfelső) részt takarja, a "float:left" (bal részen) lévő x div. Viszont annyit mondanék, hogy a Header és a Footer (alul) között SEMMI változtatást nem csináltam, csupán hogy:
position:fixed;
top|bottom:0; (egyik felül másik alul)
Mégis a baloldali div-et a Footer takarja, de a Headerbe belenyúl a balos div, miért?
Próbáltam mindegyiknél külön-külön a clear:left -et (mert baloldalon van ami problémás div) ill. a clear:both -ot mindegyik div-ben külön.
Felidegesít már..
válasza:
válasza:Rakd fel a kódod, akkor látjuk mi a baj. Ha más ötleted nincs, akkor nem tényleg a z-indexet állítsd.
válasza:A fixed elemek - mivel nem relatív pozicionálásúak - nem veszik figyelembe a clear tulajdonságot.
A z-index segíteni fog.
A forráskód, a html-en belül írtam a CSS-t, style közé ( nem külső text/css.css fájlba)
body {
min-width:100%;
min-height:100%;
font-weight:bold;
font-size: 24;
padding: auto;
margin: auto;
}
#Header {
width:100%;
height:40;
text-align:center;
background-color:green;
color:white;
position:fixed;
top:0;
padding:5;
margin:auto;
}
#Social {
float:left;
width:180;
height:100%;
text-align:left;
background-color:navy;
color:white;
position:fixed;
padding:10;
margin:auto;
}
#Footer {
width:100%;
height:20;
text-align:center;
background-color:grey;
color:white;
position:fixed;
bottom:0;
font-size: 16;
padding:5;
margin:auto;
}
Minden div külön méretet, pozíciót, padding-,margin-,border-t kap ezért van ismétlődés az x, y div stílusában.
válasza:A fixed elemek nem veszik figyelembe a float értéket sem.
Mértékegység nélküli méreteket használsz, a böngészők figyelembe sem fogják venni őket. egyedül a 0 értéknél nem kötelező kitenni mértékegységet, mivel az minden szempontból zéró.
A margin értékek is teljesen feleslegesek fixed blokkok esetén.
Css-ben is lehet számításokat végezni, erre való a Calc. Javaslom nézz utána. Nagyon jól jön fixed vagy absolute pozíciók számolgatásakor.
Emllett ha nincs kedved külön számolgatni a padding/border értékekkel, akkor a box-sizing tulajdonsághasználata nagyon ajánlott.
Köszönöm a válaszokat és a linket is, #Drone007
Sokat megtudtam, amit a w3schools-on sok-sok ideig kerestem! :D :)
Kapcsolódó kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!