28220 sujets

CSS et mise en forme, CSS3

Pages :
Bonsoir,

Bon, maintenant que mon menu horizontal fonctionne très bien, je passe à la suite de la page, et bien sûr comme toujours, sur IE rien ne marche...

http://bricosign.free.fr/xeki/

Sous firefox les divs prennent bien toute la page, alors que sous IE ils prennent la taille de leur contenu.

Voici le code CSS correspondant aux 3 divs qui posent problème (fichier complet à cette adresse: http://bricosign.free.fr/xeki/css/styles.css):


#menu {
	background: #3e3e3e;
        float:left;
        width: 158px;
        position: absolute;
        top: 86px;
        left: 0px;
        bottom: 35px; 
}
#contenu {
	background: #e7e7e7;
        position: absolute;
        top: 86px;
        left: 159px;
        bottom: 35px; 
        right: 0px; 
}
#footer {
	height: 34px;
	background: url(../images/bleu.jpg);
        clear: both;
        position: absolute;
        left: 0px;
        bottom: 0px; 
        right: 0px; 
}


Je pense que c'est peut être à cause d'un mauvais élément parent ou quelque chose comme ça.

Bonne journée.

Rémi
Modifié par *|~ XiKuXan ~|* (17 Apr 2006 - 16:36)
Salut,

Je n'ai pas Internet Explorer sous la main, je ne peux donc pas t'aider en conséquence. Mais pour moi une largeur de 100% est une largueur fluide Smiley cligne
Je vais essayer avec une largeur de 100%; mais ça ne résoud pas le problème au niveau de la hauteur (où le 100% ne marche pas car les divs font alors la hauteur de toute la page, et je pense que ça fera pareil au niveau de la largeur)... Smiley cligne
papyjo > En mettant une hauteur de 100%, le div a alors pour hauteur 100% de la page, et est donc beaucoup trop grand; de même pour la largeur.

Quelqu'un a une autre solution ?

Il faudrait savoir pourquoi position: absolute; ne marche pas correctement - comme sur firefox - avec IE...

[Edit]: Un width: 100%; sur le footer a résolu le problème pour le footer, mais reste le menu et la zone de contenu.
Modifié par *|~ XiKuXan ~|* (17 Apr 2006 - 18:39)
je crois qu'avec des height 100% ca doit fonctionner sans probleme
si tu ne mets pas position:absolute;
jp94 a écrit :
je crois qu'avec des height 100% ca doit fonctionner sans probleme
si tu ne mets pas position:absolute;


Non, même en enlevant partout position:absolute; quand je met height: 100%; le div a alors pour hauteur 100% de la page, ce qui est beaucoup trop... Smiley biggol
Hello ! Je n'ai pas pris le temps de bien approfondir mais pour obtenir deux colonnes verticales de la même hauteur il faut recourrir à une astuce comme expliqué => ici sur le site pompage <=
Le truc c'est qu'un div ne peut pas avoir de taille en % si la hauteur de son div parent est elle aussi exprimée en %.

J'espere ne pas être à coté de la plaque. Bye Smiley smile
Modifié par Ralfman68 (17 Apr 2006 - 20:09)
Ralfman68 a écrit :
Hello ! Je n'ai pas pris le temps de bien approfondir mais pour obtenir deux colonnes verticales de la même hauteur il faut recourrir à une astuce comme expliqué
ici sur le site pompage
J'espere ne pas être à coté de la plaque. Bye Smiley smile


Non non tu n'es pas à côté de la plaque. J'ai lu l'article mais le problème (toujours des problèmes avec moi) c'est que je veux pouvoir mettre une bordure sur les blocs.

Pompage.net a écrit :

Il est important de noter que si on souhaite des bordures, des remplissages, et des marges sur l'une ou l'autre des colonnes, on devra faire du rafistolage pour IE/Windows à l'aide du modèle de boîte de Tantek Çelik. Voir le Box Model Hack ou le Mid Pass Filter.


Mais je ne comprend pas du tout comment marchent ces hack: http://www.tantek.com/CSS/Examples/boxmodelhack.html et http://www.tantek.com/CSS/Examples/midpass.html
Et puis ce que je ne comprend pas aussi, c'est pourquoi sous IE le div contenu ne s'étend même pas en largeur, alors que normalement le problème ne devrait se poser qu'en hauteur.
Re. Je me permets d'insister as-tu lu l'article de pompage "les colonnes factices" ? voici un extrait et il résume ton problème je crois :
a écrit :
... Une colonne peut être plus longue que l'autre . En fonction de la quantité de contenu imbriqué, il devient difficile de créer une mise en page avec deux grandes colonnes de tailles égales ...
Oui je l'ai lu 3 fois pour essayer de comprendre... Mais le problème c'est que la technique marche avec une image de fond, et moi je voudrais pouvoir mettre une bordure.
C'est impossible, la bordure sur le côté droit et en bas et d'une certain couleur, et d'une autre couleur du côté gauche et en haut.
Pages :