100% height en list style

**Mathijs Kingma** · 21-02-2010, 18:01

Hallo,

Ik heb zojuist mijn eerste wordpress site klaar en ik kamp nog met 2 kleine problemen.
Het gaat om de volgende site: http://bit.ly/ap5nU4

Het 1e probleem is dat de list style niet weg wil en dat ik de titel erboven niet wegkrijg.
Weet iemand of de mogelijkheid er is in wordpress om deze titel weg te laten?

Het 2e probleem is dat het rechtermenu niet mee wil rekken, hij moet namelijk tot 10px onder de onderkant blijven rekken.
Voor deze sidebar gebruik ik de volgende code:

Code:

#sidebar {
	width: 200px;
	height: 100%;
	min-height: 725px; 
	background-color: #ffc9e2;
	margin: -196px 10px 2px 0;
	float: right;
}

Ik maak hierbij dus gebruik van een negatieve margin wat ik zelf niet echt mooi vind.
Heb al verschillende dingen geprobeerd zoals !important, auto en nog een paar. Het gaat hier dus om dat de negatieve margin niet meer nodig hoeft te zijn en dat deze sidebar meerekt naar beneden.

Ik hoop dat iemand mij hiermee kan helpen.

Ook zie ik op mijn laptop met ie7/8 dat de footer niet wordt weegegeven, is dat bij jullie ook zo?

Mvg,

Mathijs Kingma
Aanvullend bericht:
Ik wil er evt een kleine vergoeding voor geven!

**P. Beulque** · 22-02-2010, 15:52

Code:

.widgettitle { display: none; }
.koppelingen li ul { list-style-type:none; }

Dat fixt het 1e probleem.

Voor het tweede probleem zou een kleine JS helpen.

**Erik Terwan** · 22-02-2010, 15:57

2e probleem zou ik zo doen (met js) is lekker snel anders zijn er ook nog allemaal css oplossingen maar daar moet je altijd weer helemaal je html voor ombouwen (faux columns).

Code:

<script>
var hoogte = document.getElementById('ID VAN DE DIV HOE HOOG HIJ MOET ZIJN').offsetHeight;
document.getElementById('ID VAN DE DIV DIE NET ZO HOOG MOET').style.height = hoogte + 'px';
</script>

**P. Beulque** · 22-02-2010, 15:59

Inderdaad, zo'n JS code als hierboven bedoel ik.

(Sorry, had perongeluk dubbelgepost en heb dus deze tekst maar aangepast)

**Tom Heek** · 22-02-2010, 16:00

Ik zou trouwens bij de header het volgende doen:
1. Neem geen stockphto's doe je dit wel, neem ze dan zonder een watermerk er op.
2. Neem een langere gradiënt om ze in elkaar over te laten lopen, ik vind dat persoonlijk mooier.

**Mathijs Kingma** · 22-02-2010, 16:45

Hartelijk dank!
Ik heb de JS code in de head tags geplaatst en de volgende code gebruikt:

Code:

<script>
var hoogte = document.getElementById('content').offsetHeight;
document.getElementById('sidebar').style.height = hoogte + 'px';
</script>

Maar dit helpt helaas niet, wat doe ik fout?

En P. Beulque, dit heeft het probleem inderdaad opgelost! dankjewel

**Tjerk de Heer** · 22-02-2010, 17:56

Hopelijk werkt dit beter.

In je <head> :

Code:

<script type="text/javascript">
function divHoogte() {
  var hoogte = document.getElementById('content').offsetHeight;
  document.getElementById('sidebar').style.height = hoogte + 'px';
}
</script>

En dan na het laden van de pagina de sidebar aanpassen door de functie aan te roepen:

**Mathijs Kingma** · 22-02-2010, 18:00

Alweer bedankt, dit werkt voor mij. Alleen komt hij nu nog niet helemaal tegen de grond aan, omdat hij even lang als de content moet zijn, maar aangezien ik een negatieve margin gebruik, begint hij al helemaal van bovenaan te tellen en mist er dus een stuk.

Het enige probleem wat er dus nog overblijft is de negatieve margin wegwerken.

Code:

#sidebar {
	width: 200px;
	min-height: 725px; 
	background-color: #ffc9e2;
	margin: -196px 10px 2px 0;
	float: right;
}

Als ik van -196 > 0 maak dan begint hij vanaf de onderkant van het menu.

Gr. mathijs

**Tjerk de Heer** · 22-02-2010, 18:08

Als het een vast aantal pixels is die je tekort komt, kun je die er binnen de functie ook gewoon bij optellen natuurlijk.

Oftewel bij bijvoorbeeld 50px tekort:

Code:

var hoogte = document.getElementById('content').offsetHeight + 50;

Maar als je niet tevreden bent over de negatieve margin is het sowieso verstandig die weg te kiezen.

**Mathijs Kingma** · 22-02-2010, 18:33

Met die + 196 ziet hij er inderdaad toppie uit!

Maar ik snap zelf niet dat ik een negatieve margin moet gebruiken, net ofdat mijn header of menu 1px te breed is waardoor hij eronder komt te zitten.

100% height en list style

100% height en list style Wordpress

Tags voor dit bericht

Quick links

Sitedeals

Andere media

Over Sitedeals

100% height en list style

100% height en list style Wordpress

Tags voor dit bericht

Quick links

Sitedeals

Andere media

Over Sitedeals

Inloggen