positionnement Ie et FF

**starr** · 21/07/2006, 09h06

bonjour voila, sous internet explorer mon chat s'affiche bien avec le bas de page a la bonne place.

mais quand je l'ouvre avec FIREfox le bas de page se retrouve en haut a droite :s .

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<?php
 
        session_start();
        header('content-type:text/html;charset=iso-8859-1');
 
        if(!isset($_SESSION['login']))
        {
 
                exit;
        }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title>Discutez en direct sur liens sexy</title>
	<link rel="stylesheet" href="style.css" type="text/css" media="all" />
	<script type="text/javascript" src="script.js"></script>
</head>
<body>	<div id="logo_haut1"><p>&nbsp;</p></div>
		<div id="logo_haut"><p>&nbsp;</p></div>
	<p id="chat_haut">Bienvenue sur le chat :)</p>
	<div id="chat_centrage">
		<label id="chat_html"></label>
		<div id="chat_connectes">
			<p>Connectés au chat :</p><hr />
			<label id="connectes"></label>
		</div>
		<div id="chat_bas">
			<form action="javascript:envoi_message()">
				<p class="pm"><input type="text" name="message" id="message" size="82" /><input type="submit" value="Ok" class="gris" /></p>
			</form>
			<p id="smileys"><a href="javascript:sm(':-)')"><img src="smileys/smile1.gif" alt="" /></a><a href="javascript:sm(':-))')"><img src="smileys/smile2.gif" alt="" /></a><a href="javascript:sm(':-(')"><img src="smileys/smile10.gif" alt="" /></a><a href="javascript:sm('^^')"><img src="smileys/smile30.gif" alt="" /></a><a href="javascript:sm(':P')"><img src="smileys/smile5.gif" alt="" /></a><a href="javascript:sm('::|')"><img src="smileys/smile6.gif" alt="" /></a><a href="javascript:sm('^p')"><img src="smileys/smile21.gif" alt="" /></a><a href="javascript:sm(':[]:')"><img src="smileys/smile32.gif" alt="" /></a><a href="javascript:sm(':coeur:')"><img src="smileys/smile33.gif" alt="" /></a><a href="javascript:sm(':lol:')"><img src="smileys/smile24.gif" alt="" /></a><a href="javascript:sm(':mouais:')"><img src="smileys/smile34.gif" alt="" /></a><a href="javascript:sm(':etonne:')"><img src="smileys/smile15.gif" alt="" /></a><a href="javascript:sm(':enerve:')"><img src="smileys/smile13.gif" alt="" /></a><a href="javascript:sm(':ouais:')"><img src="smileys/smile20.gif" alt="" /></a>
			<form id="form_statut" action="#">	</p>
				<select id="s_statut" onchange="javascript:statut()">
					<option value="0">En ligne</option>
					<option value="1">Occupé</option>
					<option value="2">Parti manger</option>
					<option value="3">Absent</option>
					<option value="4">Au t&eacute;l&eacute;phone</option>
					<option value="5">De retour bient&ocirc;t</option>
				</select>
			</form>
		</div>
	</div>
 
	<script type="text/javascript">
                setTimeout(lire_messages,2000);
                setTimeout(connectes,2000);
        </script>
<div><p>&nbsp;</p></div>
	<div class="basdepage"><p>TSTTFTFTFTFTFTFTF</p></div>
</body>
</html>

Et voici ma feuille de style

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
body,#chat_haut{
 text-align:center;
 background-color:#ffffff;
}
#corp{
background-color:#C6E7B8;
}
#logo_haut{
margin-left:auto;
margin-right:auto;
text-align:center;
background-image:url(img/1.jpg);
background-repeat:no-repeat;
width:704px; 
height:117px;
padding:0;
}
 
#logo_haut1{
margin-left:auto;
margin-right:auto;
background-image:url(img/2.jpg);
background-repeat:no-repeat;
width:704px; 
height:183px;
padding:0;
 
}
.basdepage{
margin-left:auto;
margin-right:auto;
width:704px; 
height:50px;
background-color:#FFFFFF;
background-image:url(img/3.gif);
background-repeat:no-repeat;
}
#chat_haut{
 height:35px;
 line-height:35px;
 color:#526599;
 background-color:#C6E7B8;
}
#pas_enregistre{
 display:none;
}
#haut,#form{
 text-align:justify;
}
#haut,#form,#chat_haut{
 margin-top:5px;
 border:1px dashed #C0C0C0;
}
.connec,.voice,.admin,.mode{
 cursor:help;
}
#haut,#form,#chat_haut,#chat_centrage{
 width:704px;
 margin-left:auto;
 margin-right:auto;
}
#chat_html,#chat_connectes,#chat_bas{
 float:left;
}
#chat_bas{
vertical-align:bottom;
 border:1px dashed #C0C0C0;
 }
#chat_html{
 border:1px dashed #C0C0C0;
 width:570px;
 height:430px;
 background-color:#C6E7B8;
}
#chat_connectes{
 width:124px;
 margin-left:5px;
 height:430px;
 background-color:#C6E7B8;
}
#chat_html,#connectes{
 text-align:left;
 overflow:auto;
 background-color:#C6E7B8;
}
#connectes{
 width:119px;
 margin-left:5px;
 height:380px;
 background-color:#C6E7B8;
}
#chat_bas{
 height:70px;
 width:704px;
 text-align:left;
 background-color:#C6E7B8;
}
#form_statut{
 position:relative;
 left:370px;
 top:-25px;
}
#smileys{
 margin:5px;
 background-color:#C6E7B8;
}
#smileys img{
 margin-left:5px;
}
p,a:link,a:hover,a:visited{
 font-family:Verdana,Arial,Helvetica;
 font-size:7.5pt;
 color:#000000;
}
.marron{
 color:#AA5500;
}
.connec,.p0{
 color:#0000AA;
}
.voice,.p1{
 color:#C0C0C0;
}
.rouge,.p3,.admin,.private{
 color:#CC0000;
}
.p0,.p1,.p3,.connec,.voice,.mode,.admin,#chat_haut{
 font-weight:bold;
}
.p2{
 color:#339966;
}
.chat,.mode{
 color:#339966;
}
.gris{
 border:1px solid #C0C0C0;
 background-color:#F0F0F0;
 height:21px;
 vertical-align:middle;
 margin-left:2px;
}
hr,img{
 border:0;
}
hr{
 height:1px;
 border-top:1px dashed #C0C0C0;
}
label{
 display:block;
 font-weight:bold;
}
form{
 margin-left:10px;
}
p,body{
 margin:0;
}
p{
 line-height:20px;
}
.pm{
 margin-top:5px;
}
form{
 margin-top:0;
 margin-bottom:0;
}

j'espere que quelqu'un va savoir m'aider..

**starr** · 21/07/2006, 12h37

personne pour m'aider?

**starr** · 21/07/2006, 13h59

merci pour tout votre soutien les mecs lol

**johnkro** · 21/07/2006, 14h11

Les incompatibilités entre IE et FF c'est durement résolvable...

**starr** · 21/07/2006, 14h14

oui lol mais il doit quand meme exister un remède j'en suis sur

**kilanepa** · 21/07/2006, 16h30

Tu pourrai creer 2 css ( uen pour IE , une pour FF ). Ensuite detecter quel navigateur utilise l utilisateur et en fonction de ca, inclure la css adequat.

par exple:

Code :

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

1
2
3
4
5
 
<?php
if($browser == 'IE')echo '<link rel="stylesheet" href="styleIE.css" type="text/css" media="all" />' ;
elseif($browser == 'FF')echo '<link rel="stylesheet" href="styleFF.css" type="text/css" media="all" />' ;
?>

positionnement Ie et FF

HTML

Vue hybride

Discussions similaires

Partager

Partager