Fungerar inte att sätta höjden relativ

Permalänk
Medlem

Fungerar inte att sätta höjden relativ

Hej,

Håller på med en liten test sida och såhär ser koden ut: http://jsfiddle.net/dFk74/. Här är en bild på sidan: http://i.imgur.com/pkPlUIi.png. Det jag nu vill göra är att sätta höjden på sidebaren så att den beror på längden på content. Så om ni kollar på bilden så vill jag att det vita ska gå ändå ner tills content. Jag har testat att sätta height: 100%; på sidebaren men det fungerar inte. Hur löser jag detta?

Permalänk
Medlem

Automatisk höjd är alltid lite knepigt, det fungerar inte lika lätt som width: 100%

gör så här:

För att dina element ska kunna stretcha sig 100% på höjden måste man först säga åt body att vara 100%

body, html { height: 100%; /*Elelr den höjden du vill ha*/ padding: 0; }

Sen kan du sätta din önskade höjd på #main, t.ex 80%.
Du bör även ha din aside inom #content om du ska anpassa aside-höjd efter content-höjd.
Om du nu sätter "aside" till 100% bör den töja sig efter hela din #content.

EDIT: Skriv i en hast.
Det blir svårt att få din sidebar att följa din #content storlek, jag hittade ingen bra lösning för det iaf.

Men gör som jag skrev med body, sen kan du få element att gå sträcka sig 100%.

Visa signatur

Canon 70D | 2x Dell Ultrasharp 24" | Ryzen 3700X | 32B | GTX 1080Ti

Permalänk
Medlem
Skrivet av Florrpan:

Automatisk höjd är alltid lite knepigt, det fungerar inte lika lätt som width: 100%

gör så här:

För att dina element ska kunna stretcha sig 100% på höjden måste man först säga åt body att vara 100%

body, html { height: 100%; /*Elelr den höjden du vill ha*/ padding: 0; }

Sen kan du sätta din önskade höjd på #main, t.ex 80%.
Du bör även ha din aside inom #content om du ska anpassa aside-höjd efter content-höjd.
Om du nu sätter "aside" till 100% bör den töja sig efter hela din #content.

EDIT: Skriv i en hast.
Det blir svårt att få din sidebar att följa din #content storlek, jag hittade ingen bra lösning för det iaf.

Men gör som jag skrev med body, sen kan du få element att gå sträcka sig 100%.

Okej har lagt in det nu. Mjo ingen som verkar kunna veta hur jag kan få min aside att anpassa sig efter content.

Permalänk
Medlem

Tvi för dom som ger sig.

En lösning till detta "problem", vet ej hur godkänd den är, men det fungerar fint.
http://jsfiddle.net/dFk74/8/

http://fredrikw.se/work/sidebar.html

Visa signatur

Canon 70D | 2x Dell Ultrasharp 24" | Ryzen 3700X | 32B | GTX 1080Ti