5 svar · 248 visningar · startad av Niehls
antagligen en ganska enkel fråga.. men det här är något jag funderat länge på.
om jag med css skapar t.ex:
div.main{
position:absolute;
top:20px;
left:20px;
height:500px;
widht:100%;
}
så blir den mycket bredare än 100%, d.v.s. det blir en vertikal scroll. hur kommer det här sig?
och sedan en följdfråga;
går det inte att beräkna positionen efter högra kanten,
t.ex right:20px?
Du har ju position absolut, och left 20px därför blir det horisontal scroll. har du left:0px; skall det inte finnas.
Avståndet till högerkanten kan du göra med marginaler:
margin:20px, 20px, 20px 20px; ger effekten runt om.
ok, upptäckte att jag skrev ett dåligt exempel.
säg att i div.main ovan är left 0.
sedan skapas en div:
div.sub_main{
position:absolute;
left:20px;
width:100%;
}
som implementeras som följande:
<div class="main">
<div class="sub_main">
</div>
</div>
så skapas en vert scroll.
borde inte width i sub_main ordna sig efter bredden på parent-diven s.a.s.?
100% är 100% av webbläsaren hur du än gör om jag inte är helt borta.
Annorlunda är det om du gör en tabell med width:100%; i det andra, då skall det nog funka.
Eftersom du använder position: absolute lyfts diven ut ur det normala dokument-flödet, och eftersom du anger 100% som bredd tar den bredden från dokument fönstret.
Att du placerar en annan absolut positionerad div inuti den föregående gör bara att den hämta den divens storlek och använder som utgångspunkt.
I nyare läsare som förstår boxmodellen rätt är inte 100% 100%. Till detta läggs nämligen border, margin och padding.
dvs. Med 10px padding och 10 px margin och en width på 100% blir boxen i verkligheten 100%+42px. Att boxmodellen tolkas fel i vissa läsare kan självklart ställa till problem, men som tur är har Tantek Çelik hittat ett smidigt sätt att komma förbi detta.
