Discussion :

[VFone]

J'ai un souci d'affichage entre IE et firefox avec des div.

J'ai fait un div composé de 3 blocs: Haut, contenu et bas.

Avec du texte mes blocs s'affichent bien sous les 2 navigateurs mais avec 2 autres div dans le bloc du contenu, le bloc bas ne s'affiche plus sous firefox (enfin plus la couleur du fond) mais par contre bien sous IE.

Sous IE:

Sous Firefox:


Mon code CSS cadre:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
#cadre_1 {
           background-color: #4B4B4B;
           width: 435px;
           height: 100%;
	         float:left;
           font-size : 11px;
           font-family : Verdana, Arial, Helvetica, Geneva, sans-serif; color: #FFFFFF;
}
      		 #cadre_1_haut {
  							      background-image:url(images/.jpg);
           						height: 40px;
	                    padding-left: 10px;
	         						text-align: left;
	         						font-weight: bold;
}
      		 #cadre_1_contenu {
  							      background-image:url(images/.png);
           						background-repeat:repeat-y;
           						height: 100%;
	                    padding-left: 10px;
	                    padding-right: 10px;
	         						text-align: left;
}
      		 #cadre_1_bas {
  							      background-image:url(images/.jpg);
           						height: 40px;
	         						text-align: right;
	                    padding-right: 10px;
}

Mon code CSS image:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
#cadre_creations {
					 background-color: #ffffff;
					 margin: 7px;
					 float:left;
					 width: 180px;
					 height: 180px;
					 padding: 5px;
					 border-width: 1px;
  				 border-style: solid; 
					 border-color: #dbdbdb;
}

Mon code html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<div id="cadre_1">
<div id="cadre_1_haut"><?php echo $creations ?></div>
<div id="cadre_1_contenu">
<div id="cadre_creations"><img src="images/robot.png"></div>
<div id="cadre_creations"><img src="images/robot.png"></div>
</div>
<div id="cadre_1_bas"><a href=""><?php echo $voir_creations ?></a></div>
</div>

Merci pour votre aide.

[VFone]

Personne n'a de réponse??

[kaiser59]

Salut,

Dans ton css le div contenant les images essaye ceci, ajuste la taille pour arriver à ce que tu veux.

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

* html .cadrecreation {height:200px;}

Ceci ne modifiera que IE6

PS : Un id est unique par page donc tu n'as pas le droit d'avoir deux id avec un même nom par contre une classe oui ce qui explique pourquoi j'ai mis en classe

[hakurou]

Bonjour,

Le problème de l'id étant cité par Kaiser59 c'est bon de ce coté.

En fait le block bas, il s'affiche, mais il s'affiche en bas de la page, tout ca a cause de ton height:100%; du cadre_contenu.
faut toujours faire attention avec les height:100% !

tu peux donc retirer cette ligne css qui ne sert en plus a rien car ca ne deforme pas ta page et le bas de cadre s'affiche là ou il devrait !

(testé sur firefox et IE7)

[VFone]

Je m'excuse mais je n'y arrive pas.

Merci déjà hakurou car j'ai enlevé tous mes height:100% et ça n'a rien changé à mon site.

Et kaiser59 je ne comprend pas trop. J'ai essayé plusieurs changements mais ça fait rien.
C'est bien un problème de div car je les ai enlevés en affichant que le img et tout s'affichait sauf que les images n'ont plus de paramètres.

kaiser59 tu me dit de placer ce code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

* html .cadrecreation {height:200px;}

dans mon div contenant les images???
Je ne vois pas comment le rajouter sans faire d'erreurs.

Et aussi comment je l'affiche dans ma page html!

Merci

[kaiser59]

Désolé j'ai homis de te dire où, c'est l'habitude chez moi de savoir où

Pour que cela marche, il faut le placer dans le css externe et pour voir qu'elle div il affecte et correctement soit tu lui met une couleur différente en fond soit une valeur abérante genre 500px de large ou de longueur que tu repère immédiatement où Rappel cela n'affecte que IE6 si tu es en 7 ajoute un + pour faire +html.