Få content-området like høyt som sidebar.

[Mr Vest]

Dette her har jeg egentlig lurt på en stund nå. For å forklare kjapt og greit har jeg laget dette bildet.



Til høyre finner vi en sidebar som inneholder en annonse som da er 600px høy. Contentområdet til venstre for sidebar inneholder så lite tekst at dette ikke har en høyde på mer enn 300px. Hva kan jeg gjøre for at content-området automatisk får samme høyde som sidebar?

Jeg tenker jo at jeg kan bruke en min-height:600px; på contentområdet, men det funker jo dårlig dersom jeg plutselig vil legge til enda en annonse i sidebar.

Noen tanker om hva jeg kan gjøre for at dette her skal gå automatisk?

 

[Mr Vest]

Ja, da har jeg faktisk fått god hjelp med dette her.

Straks jeg får dette gjort selv vil jeg skrive en forklaring på det hele her i tråden. Tar sikkert et par dager før jeg skriver noe.

 

[olafmoriarty]

Min metode å fikse dette på har alltid vært å jukse: la både content og sidebar være gjennomsiktige, putt begge i en wrapper, og gi wrapperen et bakgrunnsbilde slik at det visuelt sett ser ut som om de to feltene er like høye -- de to VISUELLE feltene vil selvsagt begge være like høye som wrapper (bare husk å putte en spacergif i wrapperen utenfor div-ene som du setter til clear: both; slik at wrapperbakgrunnen faktisk blir synlig). Trenger du rammer kan du løse det også med bilder øverst og nederst i wrapperdiv.

Men har du en enklere og bedre måte å gjøre dette på, gleder jeg meg til å høre den.

 

[Mr Vest]

Neida, det er nok noe tilsvarende det du nevner jeg skal gjøre. Det var snakk om et bilde som var 1px høyt og deretter bruke det som bakgrunn i en div som går rundt både content og sidebar med repeat-y.

 

[Zita]

Dette kan vel også løses med javascript? (Med mindre jeg har misforstått)

Har gjort dette tidligere med en 3 kolonners layout:

$(document).ready(function() {
	// variabler for høyden til leftcol, rightcol og content
		// var contHeight = $('#content').height();
		// var leftHeight = $('#leftcol').height();
		// var rightHeight = $('#rightcol').height();
	 	   var mainHeight = $('#main').height();
		   
		$('#leftcol').height(mainHeight);
		$('#rightcol').height(mainHeight);
		$('#content').height(mainHeight);

 

[Mr Vest]

Godt med alternative løsninger Zita. Ryktepoeng gitt, selv om Javascript er litt fyfy.

Javascript er litt fyfy fordi det ofte er mennesker som sitter på jobb / skole som ikke har javascript aktivert i nettleseren. Da vil ikke slike løsninger fungere for de brukerne. (denne informasjonen var ment til de som ikke visste det fra tidligere.)

 

[Zita]

Mange takk! Er javascript fortsatt fy-fy altså?

Edit: så svaret ditt nå

 

[olafmoriarty]

Så lenge man sørger for å ha en side som fungerer utmerket dersom brukeren ikke har js, er det ingenting galt i å bruke javascript for å legge til avanserte funksjoner som ikke er tilgjengelige uten.

 

[Thomas Pedersen]

Må være utrolig begrederlig å surfe rundt uten javascript. Kan umulig tenke meg det er mange som fortsatt har det deaktivert.

Et interessant spørsmål er jo om du faktisk vil at de uten javascript skal kunne se siden din i det hele tatt. med tanke på at de da ikke vil kunne se google reklame eller annen reklame som vises ved hjelp av javascript. Spørs vel litt hvilken type nettside det er snakk om.

 

[Zita]

Ser av statistikken at det kun er 5% nå (2008) som har javascript deaktivert. Så lenge det ikke går utover viktige funksjoner, så burde det ikke være noe problem å bruke det lenger.

 

[Mr Vest]

Hehe, ja, det er nok ikke mye morsomt og bruke en pc uten Javascript aktivert i dag. Huff, stakkars dere som sitter på IE7 og Javascript deaktivert.