intenz fyrir 17 árum, 3 mánuðum Fjöldi lestra: 408

Div 100% height

Jæja, ég er í smá vandræðum með 100% hæð.

Ég er með 2 DIV. Eitt sem er wrapper og svo annan content DIV inni í wrappernum (hundruðum pixela fyrir neðan byrjunina á wrappernum). Ég set 100% hæð á body og wrapperinn og allt virkar flott. Hæð wrappersins fylgir browserglugganum og allt eins og í sögu.

Svo ætla ég að fá content DIVið til þess að vera samsíða wrappernum / browserglugganum og set 100% height á hann þá fer hann allt of neðarlega þannig það kemur scroll.

Skýringarmynd…
http://gaui.is/img/divdrasl.jpg

Svartur = browserglugginn
Blár = wrapper DIV
Rauður = content DIV

Hjálp? Ég er alveg að verða gráhærður.

Gaui

Whoi fyrir 17 árum, 3 mánuðum

Contentinn er 100% nema þú notaðir einhverja aðferð til að setja þessa 100px, þá kemur hann 100px neðar.
Prófa position: absolute fix á þetta?

#content {
position:absolute;
left:0; /* Eða hvað sem spaceið á að vera */
right:0; /* Mæli með því að hafa sama í left og right */
top:100px;
bottom:0;
}

Fyrra álit

intenz fyrir 17 árum, 3 mánuðum

Æji, ég sleppi þessu bara. Fuck it… hata CSS og support milli browsera.

Gaui

Fyrra álit

Rusty fyrir 17 árum, 3 mánuðum

Þetta er einhver galli í Firefox. Virkar að hafa height: auto;?

Fyrra álit

[Notanda eytt] fyrir 17 árum, 3 mánuðum

Var bara að pæla, þegar þú gerir 100%
er þá ekki verið að miða við upplausnina?

ss. 800x600 væri þá 600px height?
Ef svo er þá er þetta nokku rökrétt, 2 kassar báðir 100% af body (sem er 600px)
og ef þú bætir við extra 100px við efri part annars kassans þá myndast þetta bil

Þannig að til að fá kassan jafn stóran og hinn þá væri það 600/(600-100) = 83.33333333333334%
og það væri þá ætluð hæð content (Kanski stytta þetta aðeins)

Veit ekki hvort það sé bara ég sem er að skilja þetta svona :P
Allavega hugsa ég þetta svona út á þeim stutta tíma sem ég hafði við tölvuna hérna.
En afhverju ekki bara að nota 2 div sem eru mis stór í staðinn fyrir %?

Ef ég hef rangt fyrir mér um eitthvað af þessu endilega leiðrétta mig þar sem ég er nokkuð ný byrjaður að fikta við þetta

Fyrra álit

Brainiac fyrir 17 árum, 2 mánuðum

Var bara að pæla, þegar þú gerir 100%
er þá ekki verið að miða við upplausnina?

Nei, stærðin í % er miðuð við “parent” sem sagt það html element sem það er inni í. <html> er meðdefault height: 100%; (minnir mig alla vega) en ekki <body> svo það þarf að gera það til að það vikri, sem Gaui reyndar gerði

Fyrra álit

[Notanda eytt] fyrir 17 árum, 2 mánuðum

Ok, en hvaðan eru % reiknuð fyrir <html> þá?

Bætt við 7. febrúar 2007 - 22:20
ég meina þetta verður að vera % af einhverju

Fyrra álit

Brainiac fyrir 17 árum, 2 mánuðum

Juju en tegar sidan verdur meiri en 100% a haed (taes. hun lengist nidur fyrir skjainnn) ta verdur bilid minna en tessi 80% og ef tad er skilgreint verdur tad meira en 100px

En eg held ad html se skilgreint sem min-height: 100% en eg veit ekkert um tad.. hef ekki kannad tad

Bætt við 8. febrúar 2007 - 07:42
Sorry med lyklabordid.. er ekki a islensku :)

Fyrra álit

Brainiac fyrir 17 árum, 2 mánuðum

Virkar seinni adferdin af tessu? http://www.hugi.is/vefsidugerd/threads.php?page=view&contentId=4565665#item4566721

Fyrra álit

kindin fyrir 17 árum, 2 mánuðum

Alveg ótrúlegt, ég er í nákvæmlega sama vanda.

Fyrra álit

thrstn fyrir 17 árum, 2 mánuðum

Ekki veit ég hvernig þú fékkst content divið til að hoppa svona niður en að nota 100% height er nánast ekki hægt. Það er svo mikið sem getur skemmt fyrir þér.

Í fyrstalagi, ef þú ætlar að nota height 100% á body verðuru að taka burtu allt margin og padding á body annars færðu scroll. 100% height á body hins vegar er mjög asnalegt á milli browsera þannig að ég mæli með því að þú sleppir því.

Þá áttu eftir

div#wrapper{
border:1px solid #3a3;
height:100%;
}
div#content{
border:1px solid #33a;
height:100%;
}

.. sem að virkar svo lengi sem þú notar ekki padding, margin, né border á divin þar sem það er reiknað eftir 100% height. þannig að akkurat núna er contentdiv 100% hæð + 1px top border frá wrapper + 1px top border frá content div + 2px bottom border af sömu divum.

Þess vegna færðu skroll.

Það notar þetta enginn í css vegna þess að það er ekki practical og gott að þú ert hættur við. :D

Þorsteinn “thrstn” Ólafsson

Fyrra álit

Vefsíðugerð

Vefsíðugerð

Ofurhugar

Stjórnendur

Hverjir eru inni

Korkar - Almennt

Div 100% height

Dýr

Dægurmál

Fræði

Leikir

Lífið

Lífsstíll

Margmiðlun

Menning

Skjár

Sport

Tónlist

Tækni

Vélar

Hugi