28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Voilà mon problème qui me prend littéralement la tête depuis 2 jousr et j'ai essayé plusieurs choses sans succès.

Un conteneur (wrapper qui contient un #sidebar et #contenu)
J'ai un sidebar sur la gauche qui prend toute la hauteur du navigateur.
A côté j'ai un bloc contenu qui varie en hauteur.

Problème : quand le contenu est plus que la fenetre de naigation et qu'il y a un scroll, le sidebar
n'a plus de fond sur la partie scrollée et ne va pas jusqu'en bas de page !
ex : http://www.graphiknow.com/maquettes/zy/index.php/fr/offrir

Meme problème quand je réduis la fenêtre et qu'un scroll apparait, le sidebar diminue avec la fenetre de navigation. Comprend pas pourquoi.


#wrapper { 
	position: absolute;
	top: 0;
	height: 100% !important;
	margin: 0 0 0 0;
}

#sidebar {
	display: inline;
	float: left;
	background: rgba(85,89,93, 0.8); 
	-pie-background:rgba(85,89,93, 0.8);
	width: 200px;
	height: 100% !important;
	margin: 0 0 0 12px;
}
#contenu {
	margin: 80px 0 0 20px;
	display: inline;
	float: right;
	background: rgba(85,89,93, 0.8); 
	-pie-background:rgba(85,89,93, 0.8);
	width: 760px;
	border: 0px solid #3b6397;
}


Si quelqu'un peux m'orienter ou me dire ce qui ne va pas, ça m'aiderait pour avancer.
Merci
visionmaster a écrit :
Bonjour,

Voilà mon problème qui me prend littéralement la tête depuis 2 jousr et j'ai essayé plusieurs choses sans succès.

Un conteneur (wrapper qui contient un #sidebar et #contenu)
J'ai un sidebar sur la gauche qui prend toute la hauteur du navigateur.
A côté j'ai un bloc contenu qui varie en hauteur.


J’aurais bien aimé joué à la devinette que tu pose, mais j’ai un soucis avec la dernière phrase de ce que je cite : je ne vois pas le `DIV#contenu` varier en hauteur, il a une hauteur fixe, quoique je fasse. Tu as changé quelque chose entre temps ou est-ce le site qui se comporte différemment sous Opera (mon navigateur)… ?
Bonjour,

En fait, je me suis peut être mal exprimé quand je dis que le contenu varie en hauteur.
Le div #contenu est plus/moins important en fonction des pages, j'ai laissé 2 pages pour bien montrer la différence de comportement avec le sidebar.

J'ai également regarder plusieurs post ici et ailleurs sur les colonnes de même hauteur et colonnes factices mais ça ne répond pas à mon problème ou alors j'ai raté quelque chose dans le css.

Je vais encore une fois regarder la page pour faire des blocs de même hauteur de Raphaël.
je crois que la technique des colonnes de même hauteur ou colonnes factices ne fonctionnent pas dans mon cas.
- je voudrais que dans tous les cas le sidebar doit faire la hauteur de page. Donc il faut que l'élément parent du sidebar fasse 100%.
- dans le cas de 2 colonnes de même hauteur, si le contenu de ma colonne de droite est tout petit, mon sidebar sera tout petit aussi et n'aura plus la hauteur de 100% de la fenêtre de navigation.
- en plus le bloc contenu a une couleur grise avec une opacité de 80% et n'est pas forcément très grand.

je sais pas si je suis plus clair dans mes explications... HELP ?
visionmaster a écrit :
j'ai laissé 2 pages pour bien montrer la différence de comportement avec le sidebar.

OK! J’avais zappé ça. Je vais revoir le cas plus tard.