Problème d'affichage sous firefox mais pas sous IE

P.O.K · 18 Septembre 2008

Bonjour,

Je suis un débutant en programmation et tente de créer un site en utilisant une feuille de style.

Après avoir réussi à élimier la plupart de mes problèmes, l'un d'eux persiste... L'une de mes images d'arrière-plan n'apparait pas sous firefox... Voyez vous-même :

Sous IE :

Sous FF :

Le code de la feuille de style :

@charset "utf-8";
/* CSS Document */

body {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
margin: 0;
padding: 0;
text-align: center;
background-color : #5F0000;
border-style:hidden;
}

a img {
border:0;
}

html {
	height:100%;
	margin:0;
}

h1 {
display:none;
margin:0;
}

h2 {
background-color:#FFF;
font-size: 1.1em;
color:#005E5F;
font-weight :bold;
text-align:left;
text-align:justify;
margin:15px 5px 5px 5px;
}

ul {
list-style-type: none;
padding: 0;
margin: 0;
}

li {
list-style-image : none;
padding : 0;
margin : 0;
color: #005E5F;
}

hr {
width:70%;
color:#AC7E7E;
background-color:#AC7E7E;
height:1px;
border: 0;
}

#conteneur {
min-height: 100%;
width: 1009px;
margin: 0 auto;
position: relative;
}

#header {
margin: 0;
margin-top:3px;
height: 235;
background : url(images/header.gif) no-repeat left top;
width:1009px;
}

#conteneurcontenu1 {
margin: 0;
background : url(images/part1.gif) no-repeat left top;
width:1009px;
height:162px;
}

#part1 {
background-color: #FFF;
width:450px;
margin: 0;
margin-left:240px;
}

* html #part1 {
margin-left:0;
margin-right:90px;
}

#conteneurcontenu2 {
margin: 0;
background : url(images/fond.gif) left top;
width:1009px;
height:auto;
}

#contenu {
background-color: #FFF;
float:left;
width:450px;
margin: 0;
margin-left:240px;
}

#conteneurmenu {
width: 160px;
float : left;
background-color:#005E5F;
margin-left:18px;
}

#menuvertical {
width: 150px;
background-color: #005E5F;
margin:0;
margin-left:0;
}

#contenucopy {
margin: 0;
background : url(images/footer.gif) no-repeat left top;
width:1009px;
height:203px;
clear:both;
}

#copyright {
width: 300px;
background-color: #FFF;
margin-left:354.5px;
height:auto;
}

* html #copyright {
margin-left:0;
margin-right:10px;
}

.cont {
margin: 0 5px;
padding: 0;
color : black;
text-align:left;
}

.cont a {
color: #005E5F;
}


.cont2 {
margin: 0 5px;
padding: 0;
color : #999999;
text-align:left;
font-size:9px;
}

.cont3 {
margin: margin: 0 5px;
padding: 0;
color : black;
text-align:right;
font-style:italic;
}

.copy {
text-align:center;
padding-top: 65px;
margin:0;
font-size:9px;
color: #999999;
}

.copy a {
color: #005E5F;
text-decoration:none;
}

Le code de la page :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Association Lachak</title>
	<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>

<div id="conteneur">
	<div id="header">
		<h1 align="center">Association Lachak</h1>
	</div>
	<div id="conteneurcontenu1">
		<div id="part1">
		<br>
			<h2><img src="images/buttons/titre_bienvenue.gif"></h2>
			<p class="cont">
			<br>
			blabla
			<br>
			</p>
		</div>
	</div>
	<div id="conteneurcontenu2">
		<div id="contenu">	
			<%dim conn, ConnString, rs

			set conn = Server.CreateObject("ADODB.Connection")
			ConnString = "DBQ=" & Server.MapPath("BD/guest.mdb") & ";Driver={Microsoft Access Driver (*.mdb)};DriverId=25"
			conn.Open connString
			SQL = "select * from Message order by datemsg desc"
			set rs = conn.execute (SQL)%>

			<% if RS.EOF = true then%>
			<hr>
			<p class="cont">Il n'y a aucune new pour l'instant...</p><br>
			<%end if%>

			<%do while rs.eof = false %>
			<hr>
			<h2><%= rs("titremsg")%></h2>
			<p class="cont2"><%= rs("DateMsg")%></p>
			<br>
			<p class="cont"><%= Replace(RS("Msg"), chr(13), "<br>") %></p>
			<p class="cont3"><%= rs("nomexped")%></p>
			<br>
			<% RS.MoveNext%>
			<%loop%>
			<% RS.Close %>
			<% conn.Close %>
			<% Set conn=nothing %>
		</div>
	<div id="conteneurmenu">
		<div id="menuvertical">
			<ul>
			<li><a href="index.asp"><img src="images/buttons/button_1.gif"></a></li>
			<li><a href="programme.asp"><img src="images/buttons/button_2.gif"></a></li>
			<li><a href="emplacement.asp"><img src="images/buttons/button_3.gif"></a></li>
			<li><a href="http://myphotoalbum.com/" target="_blank"><img src="images/buttons/button_4.gif"></a></li>
			<li><a href="historique.asp"><img src="images/buttons/button_5.gif"></a></li>
			<li><a href="comite.asp"><img src="images/buttons/button_6.gif"></a></li>
			<li><a href="sponsors.asp"><img src="images/buttons/button_7.gif"></a></li>
			</ul>
		</div>
	</div>
</div>

<div id="contenucopy">
	<div id="copyright">
			<p class="copy">
			2007-2008 Lachak Association - 1926 Fully <br>
			Kit graphique - <a href="http://www.tcheval.net" target="_blank">Tcheval</a><br>
	   		</p>
		<noscript>
			<p class="copy">
			Kit Graphique : <a href="http://www.tcheval.net" target="_blank" title="Le site perso de Tcheval">Tcheval</a>
			</p>
		</noscript>
	</div>	
</div>

</body>
</html>

Pouvez-vous m'aider ?

Merci beaucoup

**yuston** · 19 Septembre 2008

#conteneurcontenu2 {
margin: 0;
background : url(images/fond.gif) left top;
width:1009px;
height:auto;
}

Je ne sais pas si c'est la cause mais tu n'as pas mis le no-repeat qu'il y a partout! Essaie de définir quel mode de répétition pour voir (x, y ou no).

P.O.K · 19 Septembre 2008

Justement, le no-repeat fait que l'image "part1" se répète en fonction de la longueur de la page. Il faudrait trouver une façon de faire comprendre cela à FF...

P.O.K · 19 Septembre 2008

#conteneurcontenu2 {
margin: 0;
background : url(images/fond.gif) left top;
width:1009px;
height:auto;
}
Je ne sais pas si c'est la cause mais tu n'as pas mis le no-repeat qu'il y a partout! Essaie de définir quel mode de répétition pour voir (x, y ou no).

Comment je fais pour "définir le mode de répétition" ?

Dudu · 19 Septembre 2008

Salut

Le mode de répétition se définit avec la propriété background-repeat.

Mais tu peux aussi l'utiliser dans la propriété raccourcie background

P.O.K · 19 Septembre 2008

Merci beaucoup pour ces réponses mais cela ne marche toujours pas...

J'ai essayé background-repeat et background. J'ai défini le mode de répétition avec y, ca marche sous IE mais pas sou firefox...

Reste-il encore d'autres alternatives ?

Merci

Djolhan · 22 Septembre 2008

Je pense que c'est tout simplement le fait de ne pas avoir déclaré de float sur tes blocs. Pour le conteneur, le fait de vouloir le centrer, il ne faut pas de float effectivement, mais si tu lui affecte un bg, tu te rendras compte que FF ne le considere pas. C'est sans doute la ton problème.

P.O.K · 23 Septembre 2008

Merci beaucoup JokoZetla ! Ca marche enfin !

Un petit float et tout fonctionne.

Merci beaucoup ;-)

Djolhan · 23 Septembre 2008

De rien, toujours un plaisir

Connexion

Problème d'affichage sous firefox mais pas sous IE

Sujets conseillés

P.O.K

yuston

P.O.K

P.O.K

Dudu

P.O.K

Djolhan

P.O.K

Djolhan

Veuillez vous connecter pour commenter

Parcourir

Activité