[REGLE] Maudit IE

Hells_Dark · 5 Août 2004

Tout d'abord, bonjour à tous,

Je commence par vous donner toutes les informations dont vous aurez besoin pour tenter de m'aider :huh:

Voici mon code CSS (validé W3C) :

body {
background-color : #F3F3F3;
height : 100%;
}

* {
font-size : 12px;
font-family :  Verdana, Arial, Helvetica, Geneva, sans-serif; 
color : black;
font-weight : bold;
margin:0; /* suppression de toutes les marges */
padding:0;
}

span {
color : #CC0000;
font-size : inherit;
}

/* header, site, footer */

#ensemble { /* contient l'ensemble du site */
text-align : center; /* centre la boite */
}

#center {
text-align : left; /* remet le texte à gauche */
position : relative;
height  : 100%;
min-height : 600px;
background-color : #FFFFFF;
border : 1px solid #E1D6CE;
margin-top: 10px;
margin-bottom : 10px;
margin-left : auto;
margin-right : auto;
width : 900px;
}

#header {
margin : 0px;
border-bottom : 1px solid #E1D6CE;
}
#header img {display: block;}

/* end - header, site, footer */

/* contenu du site */

#contenu {
background-color : #FFF8F2;
width : 766px;
margin-top : 10px;
margin-bottom : 10px;
border : 1px solid #E1D6CE;
margin-left : 122px; /* on laisse de la place pour le menu ! */
}
#incontenu {
padding-right : 10px;
padding-left : 10px;
padding-top : 10px;
padding-bottom : 10px;
}

/* end - contenu du site */

/*menu*/

#menu {
position : absolute;
top : 71px;
left : 10px;
width : 102px;
}
#menu ul {
margin-top : 10px;
border : 1px solid #E1D6CE;
list-style-type : none;
}
#menu li {
padding-left : 0px;
}
#menu li h1 {
padding-left : 10px;
}
#menu li a {
color : #CC0000;
text-decoration : none;
}
#menu li a:hover {
color : #FF0000
}
#menu h2 {
font-size : 10px;
padding-left : 10px;
}
#menu span {
font-size : 10px;
color : #CC0000;
}
#menu input {
background-color : #FFF8F2;
border : 1px solid;
font-weight : normal;
font-size : 10px;
}

/* end - menu */

/* liens */

.linka {
color : #CC0000;
text-decoration : none;
}
.linka:hover {
color : #FF0000;
}
.linkb {
font-size:11px;
text-decoration : none;
color: #003388;
}
.linkb:hover {
color: #666666;
}

/* fin des liens */

#news {
width : 240px;
font-size : 12px;
border : 1px solid #E1D6CE;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}

#edito {
float : right;
width : 450px;
border : 1px solid #E1D6CE;
margin-bottom : 10px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}

#tribune {
float : right;
clear : right;
width : 450px;
border : 1px solid #E1D6CE;
padding-top : 10px;
padding-left : 10px;
padding-bottom : 10px;
padding-right : 10px;
margin-bottom : 10px;
}
#tribune h2 {
font-size : 10px;
color: #003388;
}
#scroll {
margin-top: 10px;
margin-left: 0px;
width: 280px;
height: 150px;
overflow: auto; /* cette propriété va permettre le scroll de ce bloc */
font-size: 12px;
background-color: #EEE7E5;
border: solid 1px #003388;
}
#inscroll{
margin-left: 10px; /* pour ne pas coller le contenu du bloc au bord de celui-ci */
}

#forumstats {
clear : right;
border : 1px solid #E1D6CE;
margin-bottom : 10px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}

#forumstats2 {
border : 1px solid #E1D6CE;
margin-top : 10px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}

#citation {
width : 724px;
border : 1px solid #E1D6CE;
margin-top : 10px;
margin-bottom : 10px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}

.table {
border : 1px dashed #E1D6CE;
margin-top : 10px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}

#liens ul {
margin-top : 10px;
list-style-type : none;
}
#liens dl {
padding-left : 0px;
}
#liens dt{
margin-top : 5px;
color : #CC0000;
}
#liens a {
color : #CC0000;
text-decoration : none;
}
#liens a:hover {
color : #FF0000;
}

Puis voici mon code Xhtml (toujours validé W3C) :

<!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">
  <head>
    <title>HELLSPLAYERS TESTS CSS</title>
    <meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" />
  
<link href="styles/hells_css.css" rel="stylesheet" type="text/css" />
</head>
<body>
  
  <div id="ensemble"> 
  <div id="center"> 
    <div id="header"><img src="images/hp4.gif" alt="Hellsplayers © 2004" width="900" height="70" /></div>

    <div id="menu"> 
      <ul>
        <li><img src="images/menu_menu.gif" alt="Menu" /></li>
        <li> 
          <h1><a href="index.php">Accueil</a></h1>
        </li>
        <li> 
          <h1><a href="phpBB2/index.php">Forum</a></h1>
        </li>

      </ul>
      <ul>
        <li><img src="images/menu_membre.gif" alt="Zone membre" /></li>
        <li> 
          <h2> 
            <p><form action="connecting.php" method="post">
pseudo : 
  <input name="login" type="text" size="8" maxlength="20" />
<br />
pass : 
  <input name="pwd" type="password" size="8" />
  <br />

<input type="submit" value="logger" />
</form></p><a href="index.php?page=inscription" class="linkb">s'inscrire</a>          </h2>
        </li>
      </ul>
      <ul>
        <li><img src="images/menu_plus.gif" alt="Plus" /></li>
        <li> 
          <h1><a href="index.php?page=team">Team</a></h1>
        </li>

        <li> 
          <h1><a href="index.php?page=liens">Liens</a></h1>
        </li>
      </ul>
      <ul>
        <li><img src="images/menu_stats.gif" alt="Plus" /></li>
        <li> 
          <h2> 
                         <span>1 </span> connecté(s) <br /> dont  
            <span>0</span> <br /> membre(s) 
          </h2>

        </li>
      </ul>
    </div>
    <!--fin div#menu-->
    <div id="contenu"> 
      <div id="incontenu"> 
        <div id="edito">
<p>EDITO</p><br />
Bienvenue sur le site des <span>HELLSPLAYERS</span>,<br />

Nous sommes une communauté de joueurs qui, lorsque 
tout sera en place organiseront des tournois et autres massacres 
online sur toute sorte de jeux mais surtout les<span> 
FPS</span>...<br />
En attendant, le site est juste un endroit où toute 
sorte de joueurs ou autre viennent bavarder ou boire un chtit 
coup dans la Taverne (zone du forum où seul le <span>délire</span> 
est autorisé)... Join us !

</div>

<div id="tribune">   
TRIBUNE
<br />
<div id="scroll"> 
<div id="inscroll">
Trop puissant ce gout<br /><h2>par <span>Dark Elf</span></h2>
<br />
yoho yehe<br />
hohehe<br /><h2>par <span>Dark ELf</span></h2>

<br />
yeah man !<br /><h2>par <span>Dark ELf</span></h2>
<br />
Trop cool man !<br /><h2>par <span>Dark ELf</span></h2>
<br />
Ca péte ce site !<br /><h2>par <span>Dark ELf</span></h2>
<br />

ttt<br />
fez<br /><h2>par <span>Dark Elf</span></h2>
<br />
Salut !<br /><h2>par <span>Dark Elf</span></h2>
<br />
Bonjour !<br /><h2>par <span>Creazy r</span></h2>
<br />

Votre message ici.<br /><h2>par <span>Dark Elf</span></h2>
<br />
Votre message ici.<br /><h2>par <span>Dark Elf</span></h2>
<br />
cool<br /><h2>par <span>Dark Elf</span></h2>
<br />
Bijour <br /><h2>par <span>Dark Elf</span></h2>

<br />
cool<br /><h2>par <span>Dark Elf</span></h2>
<br />
Celui des citations aussi <br /><h2>par <span>Dark Elf</span></h2>
<br />
Le systeme de cookies a l'air de marcher !<br /><h2>par <span>Dark Elf</span></h2>
<br />
kikoo tt le monde ! yop yoyo yo yo<br /><h2>par <span>Dark Elf</span></h2>

<br />
piou piou<br /><h2>par <span>Dark Elf</span></h2>
<br />
piou piou<br /><h2>par <span>Dark Elf</span></h2>
<br />
Yahoooo !! Bijour à tous !<br /><h2>par <span>Dark Elf</span></h2>

<br />
bugy bag bug doc cool ton site man.<br /><h2>par <span>Dark Elf</span></h2>
<br />
</div>
</div>
<br />
<h1><a href="index.php?page=tribune_post" class="linkb">POSTER</a></h1>
</div>

<div id="news"> 	 
NEWS<br /><br />
<a href="index.php?page=hellsnews/affichernews&amp id=15" class="linka">:: Version 3</a> - 19/07/2004<br /><br />Et voilà ! Après des heures et des heures de programmation, la version 3 voit enfin le jour ! Celle   ... <a href="index.php?page=hellsnews/affichernews&amp id=15" class="linkb">[suite]</a><br /><br />	<a href="index.php?page=hellsnews/affichernews&amp id=14" class="linka">:: Cool tout marche !</a> - 29/06/2004<br /><br />Inauguration de toute les spécificité accomplie depuis l'an 1970 date de la première date dans le co  ... <a href="index.php?page=hellsnews/affichernews&amp id=14" class="linkb">[suite]</a><br /><br />	<a href="index.php?page=hellsnews/affichernews&amp id=12" class="linka">:: Version 3</a> - 10/06/2004<br /><br />Et oui, voilà déjà la version 3 du site des Hell's Players mais attention, ça repart avec sur un ser  ... <a href="index.php?page=hellsnews/affichernews&amp id=12" class="linkb">[suite]</a><br /><br />	</div>

<div id="forumstats">
<p>DERNIERS POSTS (dans)</p><br />
<script type="text/javascript" src="http://hellsplayers.com/phpBB2/topics_anywhere.php?mode=show&f=a&n=5&jlp=y&b=non&lpb=0&cl=linka&af=p3R0pyAtIHBhciCnbHBhpw%3D%3D"></script>
</div>

<div id="forumstats2">
 <!-- statistiques du forum //--> 
Nos membres ont posté un total de 
<span>2</span>
 messages<br />

Nous avons 
<span>1</span>
membres enregistrés<br />
L'utilisateur enregistré le plus récent est 
<span>Dark Elf</span>
</div>      </div>
      <!-- fin div#incontenu //-->
    </div>

    <!-- fin div#contenu //-->
  </div>
  <!-- fin div#center //-->
  </div><!-- fin div#ensemble //-->

</body>
</html>

Voilà mon problème (celui a lieu uniquement sous IE, sous Mozilla, c'est impeccable)

Voilà, il n'ya pas d'espace entre la boite "header" et la boite "contenu" !

Et il n'y a pas d'espace non plus entre la boite "forumstats" et la boite "forumstats2"...

(La page n'est pas en ligne....)

Merci

Modifié 6 Août 2004 par Hells_Dark

LaurentDenis · 5 Août 2004

Plutôt que ton PHP (qui n'y est pour rien, le pôvre), pourrais-tu plutôt donner le code HTML résultant de la page où ces deux problèmes apparaissent ?

sauf erreur de ma part, ton code PHP de fait aucune mention d'un id="forumstats" ou d'un id="forumstats2" : difficile de simuler ta page dans ces conditions et de voir où est le problème

Hells_Dark · 5 Août 2004

Oups...autant pour moi, je me suis trompé de page, j'édite !

Voilà :blush: ....

(au passage, le deuxième problème se passait lorsque le contenu des balises <div id="forumstats2></div> était faible, et donc c'est pas grave pour ce problème puisqu'il ya du contenu...bref, le problème est le manque d'espace au dessus du "contenu" ....)

Modifié 5 Août 2004 par Hells_Dark

LaurentDenis · 5 Août 2004

Le problème vient a priori d'un vieux bug d'IE avec les flottants, les marges, etc.

Pour ne pas le perturber, dis-lui juste que tu veux 10px en-dessous de ton header plutôt que tes 10px au-dessus de ton contenu; si tout va bien, ça dissipera ses angoisses

#header {
margin : 0 0 10px 0;
border-bottom : 1px solid #E1D6CE;
}

et

#contenu {
background-color : #FFF8F2;
width : 766px;
margin-bottom : 10px;
border : 1px solid #E1D6CE;
margin-left : 122px; /* on laisse de la place pour le menu ! */

au lieu de :

#header {
margin : 0px;
border-bottom : 1px solid #E1D6CE;
}

et

#contenu {
background-color : #FFF8F2;
width : 766px;
margin-top : 10px;
margin-bottom : 10px;
border : 1px solid #E1D6CE;
margin-left : 122px; /* on laisse de la place pour le menu ! */
}

Hells_Dark · 5 Août 2004

Et bien merci beaucoup LaurentDenis !

Tu as entièrement résolu mon problème !

La prochaine fois que j'ai un pb de la sorte avec IE, je penserais à cette astuce....satané IE tout de même !

Encore merci

Connexion

[REGLE] Maudit IE

Sujets conseillés

Hells_Dark

LaurentDenis

Hells_Dark

LaurentDenis

Hells_Dark

Veuillez vous connecter pour commenter

Parcourir

Activité