Discussion :

[niklos00]

Bonjour a tous,

Je suis en train de faire un site qui s affiche très bien sous firefox mais pas sous ie; celui-ci met une marge sous le titre, redimentionne mon cadre principal et mes polices.

Voici le site: http://membres.lycos.fr/niklos00/index.html

Est ce que quelqu'un a une idée?

Voici mon css:

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
170
171
body
{
   width: 900px !important;
   margin: auto; /* Pour centrer notre page */
   margin-top: 30px !important; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 30px!important;    /* Idem pour le bas du navigateur */
   /*background-image: url("images/fond.png"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */
}
 
 
/* L'en-tête */
 
#en_tete
{
   width: 760px !important;
   height: 150px !important;
   background-image: url("../images/logo.jpg");
   background-repeat: no-repeat;
   margin-bottom: 10px !important;
}
 
a:link {
	font-family: "Comic Sans MS", Brush Script Std;
	font-size: 14px;
	color: #000000;
	text-decoration: none;
	font-weight: 600;
 
 
}
a:visited {
	font-family: "Comic Sans MS", Brush Script Std;
	font-size: 14px;
	text-decoration: none;
	color: #000000;
	font-weight: 600;
 
}
a:hover {
	font-family: "Comic Sans MS", Brush Script Std;
	font-size: 16px;
	color: #FFCC66;
	text-decoration: none; /* Le lien deviendra souligné quand on pointera dessus */
	font-weight: 400;
 
}
a:active, a:focus {
	font-family: "Comic Sans MS", Brush Script Std;
	font-size: 14px;
	color: #000000;
	text-decoration: none;
	font-weight: 600;
	background-color: #FFCC66
 
}
a.tooltip em {
    display:none;
}
a.tooltip:hover {
    border: 0;
    position: relative;
    z-index: 500;
    text-decoration:none;
}
a.tooltip:hover em {
    font-style: normal;
    display: block;
    position: absolute;
    top: 20px;
    left: 25px;
    padding: 5px;
    color: #000;
    border: 1px solid #bbb;
    background: #ffc;
    width:170px;
	font-size: 10px;
}
a.tooltip:hover em span {
    position: absolute;
    top: -7px;
    left: 15px;
    height: 7px;
    width: 11px;
    background: transparent url(image-infobulle.gif);
    margin:0;
    padding: 0;
    border: 0;
}
p
{
   text-indent: 30px !important; /* Les paragraphes commenceront 30 pixels sur la droite */
   text-align: justify !important; /* Ils seront justifiés */
   font-size: large !important; /* Allez, soyons fous, grossissons le texte :o;) */
}
/* p:first-letter  La première lettre de chaque paragraphe 
{
   font-weight: bold;  /*En gras 
   font-size: 1.2em; /* Ecrit légèrement plus gros que la normale 
   color: blue; /* En bleu  
}
*/
#menu
{
   float: left !important; /* Le menu flottera à gauche */
   width: 200px !important; /* Très important : donner une taille au menu */
   padding:10px !important;
}
.element_menu
{
   background-color: #f6dc01;
   background-image: url("images/motif.png");
   background-repeat: repeat-x;
 
   border: 2px solid black;
 
   margin-bottom: 20px !important; /* Pour éviter que les éléments du menu ne soient trop collés */
}
/* Quelques effets sur les menus */
 
 
.element_menu h3 /* Tous les titres de menus */
{   
   color: #0b98fa;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}
 
.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("images/puce.png"); /* On change l'apparence des puces */
   padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}
 
.element_menu a /* Tous les liens se trouvant dans un menu */
{
   color: #2f4d89;
}
 
.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #2f4d89;
   color: black;
}
 
 
/* Le corps de la page */
 
#corps
{
   margin-left: 220px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   margin-top: 0px !important; /*à retiré s'il y a des bug*/
   padding: 10px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   clear: left !important;
   color: #2f4d89;
   background-color: #f6dc01; /* Une couleur de fond pour le corps */
   background-image: url("images/motif.png");
   background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
 
   border: 2px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}
h3
{	font-family: "Comic Sans MS", Brush Script Std;
	font-size: 14px;
	color: #0baee9;
	text-decoration: none;
	font-weight: 600;
}

Merci d'avance pour vos réponses !!

[Bisûnûrs]

Commence par corriger un bug énorme dans ton code HTML : une balise <script> avant le DOCTYPE qui met les navigateurs en mode Quirks et donc les laisse agir comme bon leur semble ..

[niklos00]

merci

Mais dans mon index.html, le doctype est en premier.

C'est comme ceci:

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
		<link rel="stylesheet" media="screen" type="text/css" title="CascadingStyleSheet" href="css/css_2.css" />
		<!-- <link rel="alternate stylesheet" media="screen" type="text/css" title="Design alternatif" href="css/css.css" /> -->
		<title>Bienvenue sur le site de la mission locale de Gravelines / Bourbourg</title>
 
  </head>
   <body>
 
 
<div id="en_tete">
   <!-- Ici on mettra la bannière qui sera mise directement dans le CSS -->
</div>
 
 
<SCRIPT LANGUAGE="JavaScript" SRC="scripts/ejs_menu_dyn_vert.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript" SRC="scripts/info_bulle.js"></SCRIPT>
 
 
 
<div id="corps">
		<h1>Bienvenue sur le site de la mission locale de Gravelines / Bourbourg</h1>

je comprend pas pourquoi dans le source il met le javascript avant le doctype

En tout cas, merci de ta réponse

[Bisûnûrs]

Je ne peux pas deviner pour toi. Personnellement je vois le résultat qui est cette balise script avant le DOCTYPE.

De plus, tu as tout ce code APRES la balise de fermeture du html ... :

Code html :

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
 
</pre></xmp></noscript><script language="javascript" src="http://ads.multimania.lycos.fr/ad/test_frame_size.js"></script>
 
<script language="javascript">
if (!AD_clientWindowSize()) {
        document.write("<NOSC"+"RIPT>");
}
</script>
 
<script type="text/javascript">
        function setCookie(name, value, expires, path, domain, secure) {
           var curCookie = name + "=" + escape(value) +
             ((expires) ? "; expires=" + expires.toGMTString() : "") +
             ((path) ? "; path=" + path : "") +
             ((domain) ? "; domain=" + domain : "") +
             ((secure) ? "; secure" : "");
           document.cookie = curCookie;
        }
 
        var ad_url = "http://ads.multimania.lycos.fr/ad/google/frame.php?_url="+escape(self.location)+"&gg_bg=&gg_template=&mkw=&cat=noref";
        var ref=window.document.referrer;
 
        if(parent.LycosAdFrame) {
                if(parent.memberPage && parent.memberPage.document.title ) {
                        parent.document.title=parent.memberPage.document.title;
                }
 
                if(parent.LycosAdFrame && parent.LycosAdFrame.location && (ref != "" && (ref+"?" != window.location) && (ref.substr(ref.length-1,1) != "/")) ) {
                                                parent.LycosAdFrame.location.replace(ad_url);
                }
                setCookie("adFrameForcePHP",0,0," ");
                                parent.document.body.cols = "*,140";
        }
        else if(top.LycosAdFrame && top.LycosAdFrame.location) {
                if ((ref != "" && (ref+"?" != top.window.location) && (ref.substr(ref.length-1,1) != "?"))) {
                                                top.LycosAdFrame.location.replace(ad_url);
                }
                setCookie("adFrameForcePHP",0,0," ");
                                top.document.body.cols = "*,140";
        }
        else {
                if (!window.opener) {
                        setCookie("adFrameForcePHP",1,0," ");
                }
                else {
                        setCookie("adFrameForcePHP",0,0," ");
                }
        }
                
        if (window.top.location.href.indexOf("http://membres.lycos.fr")!=-1) {
                ad_frame = 1 ;
                window.top.document.body.cols="*,140" ;
        }
 
function resizeGoogleAdFrame() {
        window.top.document.body.cols = "*,140";
}
 
 
        if (ad_frame == 1 && AD_clientWindowSize()) {
                setInterval("resizeGoogleAdFrame()", 30);
        }
                
</script>
 
<script language="javascript" src="http://ads.multimania.lycos.fr/ad/popunder_lycos_update.php?cat=noref&CC=fr"></script>
 
<script type="text/javascript" src="http://ads.multimania.lycos.fr/ad/ad.php?cat=noref&mkw=&CC=fr&ord=23d66493&adpref="></script>
 
<!-- START RedSheriff Measurement V5.01 -->
<!-- COPYRIGHT 2002 RedSheriff Limited -->
<script language="JavaScript" type="text/javascript"><!--
  var _rsCI='lycos-fr';
  var _rsCG='noref';
  var _rsDT=1;
  var _rsSI=escape(window.location);
  var _rsLP=location.protocol.indexOf('https')>-1?'https:':'http:';
  var _rsRP=escape(document.referrer);
  var _rsND=_rsLP+'//secure-uk.imrworldwide.com/';
 
  if (parseInt(navigator.appVersion)>=4) {
    var _rsRD=(new Date()).getTime();
    var _rsSE=0;
    var _rsSV='';
    var _rsSM=0;
    _rsCL='<scr'+'ipt language="JavaScript" type="text/javascript" src="'+_rsND+'v5.js"><\/scr'+'ipt>';
  } else {
    _rsCL='<img src="'+_rsND+'cgi-bin/m?ci='+_rsCI+'&cg='+_rsCG+'&si='+_rsSI+'&rp='+_rsRP+'">';
  }
  document.write(_rsCL);
//--></script>
<noscript>
<img src="//secure-uk.imrworldwide.com/cgi-bin/m?ci=lycos-fr&amp;cg=noref" alt="">
 
</noscript>
<!-- END RedSheriff Measurement V5 -->

[niklos00]

oui, j'ai compri, je pense que c'est lycos qui rajoute ce code a 2 francs pour afficher ses pub au lancement de la page.

[Xann_71]

Je ne sais pas si c'est le problème ici mais certains navigateurs ont du css par défaut qui est utilisé sur ta page même si tu as ton propre css. Essentiellement les tailles de texte, et marges justement, c'est pour sa que j'y ai pensé^^.
Voici un morceau de code css à mettre au débvut de ton code css, avant la premiere balise:

Code :

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

1
2
 
* { padding:0; margin:0; }

Apres je suis pas sur mais tu dois pouvoir rajouter des données pour la police pour annuler celles des css navigateurs.

[niklos00]

nop, je vien de tenter et ca marche po

d autres idée ??

[Bisûnûrs]

d autres idée ??

Changer d'hébergeur.