Régler le height: 100% sur FF

Question

Luminaty

9 Nov 2009 à 19:14

Bonjour à tous,

Je viens à vos précieux conseils, car le "height: 100%" ne marche pas sur FF!
J'ai pourtant cherchée, changée mon code ... mais en vain rien de fonctionne.
Je suis un peu désespérée! -_-"
Je vous envoie mon CSS et un aperçut du problème!

En vous remerciant de vos réponses.


/** GLOBAL **/
html, body, div, p, ul, li, table, tr, td, h1, h2, h3, h4 {margin: 0; padding: 0}
a, a:hover {text-decoration: none;}
.clear {clear: both; font-size: 1px; }
img{ border: none;}
ul, li { list-style: none;}



body{
	background: url("../images/fond.gif") repeat-x 0 0 #ce0067; 
	font-family: verdana; font-size: 10px;
	text-align: center;
	}

body.index{
	background:#de0b9b; 
	}

.general{
	width: 1016px;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	font-family: verdana; font-size: 10px;
	text-align: center;
	}

	.c_gauche{
		width:208px;
		height: 100%;
		float: left;
		}
		.c_gauche.presentation {
			background: url("../images/img-present.jpg") no-repeat 0 0;
			}
		.c_gauche.galerie {
			background: url("../images/img-galerie.jpg") no-repeat 0 0;
			}
		.c_gauche.hygiene {
			background: url("../images/img-hygiene.jpg") no-repeat 0 0;
			}
		.c_gauche.contact {
			background: url("../images/img-contact.jpg") no-repeat 0 0;
			}
		.c_gauche img{
			margin-top: 50px;
			}

	.c_droit {
		height: 100%;
		width: 553px;
		float: left;
		background: url("../images/fond-contenu.gif") repeat-y 0 0;
		}

	.c_droit .contenu{
		float: left;
		text-align:left;	
		}
		.c_droit .contenu .menu{
			height: 115px;
			background: url("../images/c_nav2.gif") repeat-x 0 0;
			}
			.c_droit .contenu .menu .c_nav{
				float: left;
				}
			.c_droit .contenu .menu .presentation{}
				.c_droit .contenu .menu .presentation a{
						background: url("../images/btn_present.jpg") no-repeat 0 -115px;
						display: block;
						float: left;
						height: 115px;
						width: 118px; 
						float: left;
						}
					.c_droit .contenu .menu .presentation a:hover{
						background: url("../images/btn_present.jpg") no-repeat 0 0;
						}
					.c_droit .contenu .menu .presentation a.on{
						background: url("../images/btn_present.jpg") no-repeat 0 0;
						}

			.c_droit .contenu .menu .galerie{}
				.c_droit .contenu .menu .galerie a{
						background: url("../images/btn_galerie.jpg") no-repeat 0 -115px;
						display: block;
						float: left;
						height: 115px;
						width: 118px;
						float: left;
						}
					.c_droit .contenu .menu .galerie a:hover{
						background: url("../images/btn_galerie.jpg") no-repeat 0 0;
						}
					.c_droit .contenu .menu .galerie a.on{
						background: url("../images/btn_galerie.jpg") no-repeat 0 0;
						}

			.c_droit .contenu .menu .hygiene{}
				.c_droit .contenu .menu .hygiene a{
						background: url("../images/btn_hygiene.jpg") no-repeat 0 -115px;
						display: block;
						float: left;
						height: 115px;
						width: 118px;
						float: left;
						}
					.c_droit .contenu .menu .hygiene a:hover{
						background: url("../images/btn_hygiene.jpg") no-repeat 0 0;
						}
					.c_droit .contenu .menu .hygiene a.on{
						background: url("../images/btn_hygiene.jpg") no-repeat 0 0;
						}

			.c_droit .contenu .menu .contact{}
				.c_droit .contenu .menu .contact a{
						background: url("../images/btn_contact.jpg") no-repeat 0 -115px;
						display: block;
						float: left;
						height: 115px;
						width: 118px;
						float: left;
						}
					.c_droit .contenu .menu .contact a:hover{
						background: url("../images/btn_contact.jpg") no-repeat 0 0;
						}
					.c_droit .contenu .menu .contact a.on{
						background: url("../images/btn_contact.jpg") no-repeat 0 0;
						}

		.c_droit .contenu .txt{
			height: 230px;
			color: white;
			margin-left: 20px;	
			}

				.c_droit .contenu .txt .txt_intro{
					margin: 40px 0 0 0;
					text-align: left;
					}
				.c_droit .contenu .txt .titre{
					padding: 30px 0 10px 0;
					color: #420121;
					font-size: 10px;
					text-align: left;
					}
					.c_droit .contenu .txt .titre.cliquer{
						text-align:center;
						}

				.c_droit .contenu .txt img{
					/*padding-left: 20px;*/
					}
				.c_droit .contenu .txt p{
					padding: 0 0 10px 30px; 
					}
					.c_droit .contenu .txt p.arabesque{
						background: url("../images/v_arabesque.gif") no-repeat 0 0;
						padding-left: 35px;
						}

				.c_droit .contenu .txt .important{
						font-weight: bold; color: #320019;
						}
				.c_droit .contenu .vignette ul{
						margin-left: 20px;
						}
					.c_droit .contenu .vignette ul li{
						float: left;
						}
					.c_droit .contenu .vignette ul li a{
						margin: 2px;
						}

/*galerie**/
		.c_droit .contenu .sous-menu ul{
			background: #420121;
			padding:7px 0 7px 20px;
			text-align: center;
			margin: 0;
			}
			.c_droit .contenu .sous-menu ul li{
				display: inline;
				color: white; 
				}
				.c_droit .contenu .sous-menu ul li a{
					color: white;
					font-size: 9px; font-weight: bold;
					margin: 0 5px;
					}
					.c_droit .contenu .sous-menu a:hover{
						color: #cf0166;
						}
					.c_droit .contenu .sous-menu a.on{
						color: #cf0166;
						}
	.complement{
		width: 248px;
		float: left;
		background: url("../images/fond_commentaire.gif") repeat-y 0 0;
		height: 100%;
		text-align: left;	
		}

		.complement .serie_photo.presentation{
			background: url("../images/photo_present.jpg") no-repeat 0 0;
			height:265px;
			}
		.complement .serie_photo.galerie{
			height: 292px;
			background: url("../images/photo_galerie.jpg") no-repeat 0 0;
			}
		.complement .serie_photo.hygiene{
			height: 292px;
			background: url("../images/photo_hygiene.jpg") no-repeat 0 0;
			}
		.complement .serie_photo.contact{
			height: 292px;
			background: url("../images/photo_contact.jpg") no-repeat 0 0;
			}
			
			.complement .explication{
			height: 359px;
			}
			.complement .explication p{
				padding: 15 30px;
				color: white;
				}
			.complement .explication p a{
				color: black; 
				}
			.complement .explication p a:hover{
				color: white;
				}
			
		.complement .explication img{
			}

Modifié par Luminaty (09 Nov 2009 - 20:17)

Mikachu

9 Nov 2009 à 20:04

Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

Luminaty

9 Nov 2009 à 20:24

Merci pour l'accueil. Smiley smile

Je m'excuse de ne pas avoir respectée les règles de base du Forum! :x
Je vous remercie de m'avoir remise sur le doit chemin.

Sur ce j'attends un sauveur. Smiley lol

En vous remerciant de vos réponses.

Raphael

Administrateur

9 Nov 2009 à 21:40

Hello,

Il est difficile de faire du sauvetage sans avoir les outils ni un exemple en ligne, mais à vue d'oeil, il semble que c'est simplement un problème de dépassement de flottants, non ?
http://www.alsacreations.com/astuce/lire/7-depassement-flottants-css.html

Luminaty

9 Nov 2009 à 22:38

Eh bien le lien que vous m'avez passer est très intéressante, mais ne résous pas le problème. :x
En fait, le soucie c'est que je n'arrive pas avoir un height 100% sur FireFox. Ce que je trouve bizarre c'est que ça fonctionne bien sur IE et plus ou moins bien sur Opera... :'(

...oui il faudrait que je mette en exemple en ligne...
Je vais surement paraître agaçante! Mais il me faudrait un guide pour que je puisse mettre au moins une page en ligne. :x

Sinon bien merci de m'avoir répondu aussi rapidement.
Bonne soirée

Sujet clos