28220 sujets

CSS et mise en forme, CSS3

CSS - Problèmes sous IE

Bonjour,

Voilà, je commence l'apprenttisage du CSS et je recontre quelques problèmes. J'ai commencé une page xhtml avec les styles CSS.

Tout va bien sous Firefox mais sous IE rien ne va plus.

C'est pourrquoi je viens vous demander de l'aide.

http://dev.hot-nights.ch

Le CSS est joint ci-dessous.

Je vous remercie d'avance !

/* CSS Document */

/* En-tête*/
.header {
	width:100%;
	background-image: url(headerBack.jpg);
	background-repeat:repeat-x;
	height:126px;
}

.headerGauche {
	float:left;
	margin-left:0px;
	width:193px;
	height:126px;
	background-image: url(headerGauche.jpg);
	background-repeat:no-repeat;
}

.headerDroite {
	float:right;
	margin-right:0px;
	width:385px;
	height:126px;
	background-image: url(headerDroite.jpg);
	background-repeat:no-repeat;
}

/* Col. gauche - Centre - Col. droite*/
.gauche {
	position: absolute;
	left: 0px;
	top: 140px;
	width: 180px;
	margin-left:10px;
}

.centre {
	margin: 14px 200px 0px 200px;
}
	
.droite {
	position: absolute;
	right: 0px;
	top: 140px;
	width: 180px;
	margin-right:10px;
}

/* Boites gauches, droites et centres */
.boiteNavigation {
	margin-bottom:10px;
	border: 1px solid #3B424A;
	background-color:#efefef;
}

.boiteInfo {
	margin-bottom:10px;
	border: 1px solid #3B424A;
	background-color:#efefef;
	text-align:center;
	padding-bottom:10px;
}

.boiteCentre {
	margin-bottom:10px;
	border: 1px solid #3B424A;
	/*min-height:50px;*/
	background-color:#FFFFFF;
}

.boiteNavigation h1, .boiteInfo h1, .boiteCentre h1 {
	background-image: url(headerBg.gif);
	background-repeat:repeat-x;
	background-position:top;
	color:#FFFFFF;
	margin:-1px;
	padding-top:3px;
	font-size:12px;
	height:20px;
	text-align:center;
}

.boiteNavigation a {
	border-style: none;
	font-weight: normal;
	display: block;
	padding: 5px 10px 5px 10px;
	color: #303955;
	background-color: #efefef;
	text-decoration:none;
}

.boiteNavigation a:active, .boiteNavigation a:hover {
	background-color: #ffffff;
	border-top: 1px solid #3B424A;
	border-bottom: 1px solid #3B424A;
	display: block;
	padding: 4px 10px 4px 10px;
	color: #4F5E8E;
	text-decoration:none;
}

.boiteNavigation li {
	display: inline;
}

.boiteNavigation > ul > li:last-child a:active, .boiteNavigation > ul > li:last-child a:hover {
	border-bottom-color: #ffffff;
}

.boiteNavigation ul {
	margin-top:0px;
	margin-bottom: 0px;
	padding: 0px;
}

body {
	font-size : 0.9em;
	font-family : Arial, sans-serif, Verdana, Geneva, Helvetica;
	margin : 0px;
	background: #000000;
}

Modifié par racing66 (30 Jan 2006 - 09:08)
Losque j'ouvre le site dans firefox, tous va bien. Par contre lorsque je l'ouvre dans IE, les boites sont décalées. les "margin" ne sont plus respecter..

Je suis donc à la recherche d'une solution mais je ne trouve pas le pourquoi du comment !

Merci...
Modifié par racing66 (30 Jan 2006 - 09:11)
Sujet clos
Aller à