Partage
  • Partager sur Facebook
  • Partager sur Twitter

probléme div/css sous firefox

11 mars 2006 à 0:36:22

bonjour, pour m'entrainer au css avec des div, j'ai fait juste une page qui me servira de page lien vers un forum d'aide scolaire,
donc j'ai fouillé sur le net pour trouver ce dont j'avais besion, j'ai rentré toutes les valeurs et sous mon internet explorer ca marche,
mais, sous firefox, les blocs se chevauchent, je n'arrive pas à régler le probléme mise a part le fait de redimensionner pour que cela rende bien sous firefox mais dans ce cas la, la mise en page avec IE est boiteuse...


Je vous passe mes codes car, je ne comprends pas, merci d'avance pour votre aide :

voici ma page html :


Citation : moi

<HTML>
<HEAD>

<LINK href="archive.css" type=text/css rel=stylesheet>
</HEAD>
<BODY>

<center>

<div class="page">
<center>
<IMG SRC="ban.gif">
<div class="menu">
<a href="">Forum de Littérature</a>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
<a href="">Forum de Philosophie</a>
</div>
<BR>
<div style= "width:899">
<div class="Gauche"> xdgfhdcgfhcjh dfgsgfsfdgs</div>
<div class="Gauche2"> xdgfhdcgfhcjh dfgsgfsfdgs</div>
<div class="Centre">
<FONT COLOR=RED size=6><B>AIDE SCOLAIRE</B></FONT>
<BR>
<FONT COLOR=RED>Forum d'aide pour la Littérature et la Philosophie</FONT>
<BR>
<HR>
<BR>
</div>
<div class="Droite"> fhgdftyhfcgjhf sdfgsgfsfdgxfd</div>
<div class="Droite2"> fhgdftyhfcgjhf sdfgsgfsfdgxfd</div>
<div class="pub"></div>
</div>
</div>
</BODY>
</HTML>



et mon css :


Citation : moi

div.page{
text-align: left;
background: #FFF;
width: 937px ;
height: 700px ;
border-bottom:solid 1px;
margin-left: auto ;
margin-right: auto ;
background-image: url(fond.jpg)
}

div.Gauche {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font-family:Arial,Helvetica;
font-size:14px;
text-align:center;
width: 190px;
height: 130px;
float: left
}

div.Gauche2 {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font-family:Arial,Helvetica;
font-size:14px;
text-align:center;
width:190px;
height:130px;
position: absolute;
top: 500px;
left: 52px
}

div.Centre {
margin-left:10px ;
margin-right:10px;
padding:10px ;
background-color:#F8F6F7;
border-style:dashed;
border-width:1px;
border-color:#A0A0A0;
text-align:left;
font-family:Arial,Helvetica;
font-size:14px;
text-align:center;
width: 500px;
height: 500px;
position:absolute;
top: 200px;
left: 243px
}

div.Droite {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font-family:Arial,Helvetica;
font-size:14px;
text-align:center;
width:189px;
height:130px;
float:right
}

div.Droite2 {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font-family:Arial,Helvetica;
font-size:14px;
text-align:center;
width:189px;
height:130px;
position: absolute;
top:500px;
right:50px
}

div.menu {
font-size: 1em;
background: #000000 url('menu_background.gif');
background-repeat: repeat-x;
width: 899px;
height: 22px;
float:center
}

div.pub {
padding:10px ;
background-color:#F8F6F7;
border-style:solid;
border-width:1px;
border-color:black;
text-align:left;
font-family:Arial,Helvetica;
font-size:14px;
text-align:center;
width: 900px;
height: 50px;
position: absolute;
top: 665px;
left: 52px;
}



merci pour votre aide...cordialement
  • Partager sur Facebook
  • Partager sur Twitter
11 mars 2006 à 9:07:43

UTILISE LES BALISE <code > et </code>!!!!

<HTML>
<HEAD>

<LINK href="archive.css" type=text/css rel=stylesheet>
</HEAD>
<BODY>

<center>

<div class="page">
<center>
<IMG SRC="ban.gif">
<div class="menu">
<a href="">Forum de Littérature</a>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
<a href="">Forum de Philosophie</a>
</div>
<BR>
<div style= "width:899">
<div class="Gauche"> xdgfhdcgfhcjh dfgsgfsfdgs</div>
<div class="Gauche2"> xdgfhdcgfhcjh dfgsgfsfdgs</div>
<div class="Centre">
<FONT COLOR=RED size=6><B>AIDE SCOLAIRE</B></FONT>
<BR>
<FONT COLOR=RED>Forum d'aide pour la Littérature et la Philosophie</FONT>
<BR>
<HR>
<BR>
</div>
<div class="Droite"> fhgdftyhfcgjhf sdfgsgfsfdgxfd</div>
<div class="Droite2"> fhgdftyhfcgjhf sdfgsgfsfdgxfd</div>
<div class="pub"></div>
</div>
</div>
</BODY>
</HTML>


div.page{
text–align: left;
background: #FFF;
width: 937px ;
height: 700px ;
border–bottom:solid 1px;
marginleft: auto ;
marginright: auto ;
background–image: url(fond.jpg)
}

div.Gauche {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font–family:Arial‚Helvetica;
fontsize:14px;
text–align:center;
width: 190px;
height: 130px;
float: left
}

div.Gauche2 {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font–family:Arial‚Helvetica;
fontsize:14px;
text–align:center;
width:190px;
height:130px;
position: absolute;
top: 500px;
left: 52px
}

div.Centre {
margin–left:10px ;
marginright:10px;
padding:10px ;
backgroundcolor:#F8F6F7;
border–style:dashed;
borderwidth:1px;
bordercolor:#A0A0A0;
text–align:left;
font–family:Arial‚Helvetica;
fontsize:14px;
text–align:center;
width: 500px;
height: 500px;
position:absolute;
top: 200px;
left: 243px
}

div.Droite {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font–family:Arial‚Helvetica;
fontsize:14px;
text–align:center;
width:189px;
height:130px;
float:right
}

div.Droite2 {
border:double green;
background: url('fond.gif');
padding:5px ;
color:black;
font–family:Arial‚Helvetica;
fontsize:14px;
text–align:center;
width:189px;
height:130px;
position: absolute;
top:500px;
right:50px
}

div.menu {
fontsize: 1em;
background: #000000 url('menu_background.gif');
backgroundrepeat: repeat–x;
width: 899px;
height: 22px;
float:center
}

div.pub {
padding:10px ;
backgroundcolor:#F8F6F7;
border–style:solid;
borderwidth:1px;
bordercolor:black;
text–align:left;
font–family:Arial‚Helvetica;
fontsize:14px;
text–align:center;
width: 900px;
height: 50px;
position: absolute;
top: 665px;
left: 52px;
}
  • Partager sur Facebook
  • Partager sur Twitter
11 mars 2006 à 9:13:32

Merci vicovni ^^

Sinon, pourrais tu nous montrer des captures d'ecrans de ton site avec Firefox et Internet Explorer ? :)
  • Partager sur Facebook
  • Partager sur Twitter
11 mars 2006 à 9:49:32

voici ma capture d'écra avec internet explorer

Image utilisateur


et ma capture avec firefox :

Image utilisateur

donc, ca ce chevauche et les tailles se perdent, mais come vous pourrez le remarquer cela ne se produit que pour les blocs dont la position est definie "absolute".
  • Partager sur Facebook
  • Partager sur Twitter

probléme div/css sous firefox

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
  • Editeur
  • Markdown