Sujet Précédent Sujet Suivant

Border: Compatibilité IE et Firefox

Fermé
kuuppp - 15 avril 2008 à 12:31
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 - 15 avril 2008 à 13:19
Bonjour,
j'ai un problème avec un design que je crée actuellement, tout est comme je le veux sous firefox les bordures apparaissent mais pas dans IE!
je vous mets mon code:


<!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-1" />
<title>Document sans nom</title>
<style type="text/css">
<!--
body
{
background-color: #2F4F4F;
color: #FF7F50;
margin: 25px; <!-- Pour que le texte n'aille pas jusqu'au bord de l'écran -->
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 1em;

}

#centre
{
float: none;
border-color: white;
border-style: groove;

}
#centre_gauche
{

border: white;
border-style: groove;
padding: 15px;
}

#centre_droit
{


border: white;
border-style: groove;
padding: 15px;

}

#banniere
{
border-style: inset;
border-color: white;
}


#menu_haut
{
font-family: Comic Sans Ms;
color: white;
text-align: center;
border-color: white;
border-style: inset;
}

#menu_haut a
{
text-decoration: none;
color: white;
}

#menu_haut a:hover
{
background: #FF7F50;
}



-->
</style>
</head>

<body>
<div id="banniere">
<img src="images/banniere.bmp" width="100%" />
</div>
<div id="menu_haut">
<a href="">Accueil</a> | <a href="">Lien</a> | <a href="">Lien</a> | <a href="">Lien</a> | <a href="">Lien</a>
</div>
<div id="centre">
<div id="centre_gauche">
Alimentorum cibos tamen per propinquantis cibos solitarum ipsi ipsi frumenta frumenta cibos per clausos quae frumenta quod quae Isauri navigiis ipsi vero vehementer horrebant consumendo flumen angebat adfluebant flumen frumenta propinquantis Isauri flumen alimentorum quod copiis Isauri cibos per vehebant ipsi quae frumenta inediae alimentorum cibos frumenta alimentorum navigiis Isauri quae frumenta per clausos quidem solitarum tamen consumendo consumendo ipsi cibos Isauri adfluebant adfluebant solitarum angebat solitarum copiis flumen ipsi Isauri horrebant horrebant vehementer vero inediae clausos vehebant rerum ipsi rerum alimentorum quidem quae alimentorum per navigiis quae adfluebant vehementer inediae copiis quidem Isauri solitarum ipsi vehebant ipsi adfluebant Isauri.
Alimentorum cibos tamen per propinquantis cibos solitarum ipsi ipsi frumenta frumenta cibos per clausos quae frumenta quod quae Isauri navigiis ipsi vero vehementer horrebant consumendo flumen angebat adfluebant flumen frumenta propinquantis Isauri flumen alimentorum quod copiis Isauri cibos per vehebant ipsi quae frumenta inediae alimentorum cibos frumenta alimentorum navigiis Isauri quae frumenta per clausos quidem solitarum tamen consumendo consumendo ipsi cibos Isauri adfluebant adfluebant solitarum angebat solitarum copiis flumen ipsi Isauri horrebant horrebant vehementer vero inediae clausos vehebant rerum ipsi rerum alimentorum quidem quae alimentorum per navigiis quae adfluebant vehementer inediae copiis quidem Isauri solitarum ipsi vehebant ipsi adfluebant Isauri.
</div>
<div id="centre_droit">
Alimentorum cibos tamen per propinquantis cibos solitarum ipsi ipsi frumenta frumenta cibos per clausos quae frumenta quod quae Isauri navigiis ipsi vero vehementer horrebant consumendo flumen angebat adfluebant flumen frumenta propinquantis Isauri flumen alimentorum quod copiis Isauri cibos per vehebant ipsi quae frumenta inediae alimentorum cibos frumenta alimentorum navigiis Isauri quae frumenta per clausos quidem solitarum tamen consumendo consumendo ipsi cibos Isauri adfluebant adfluebant solitarum angebat solitarum copiis flumen ipsi Isauri horrebant horrebant vehementer vero inediae clausos vehebant rerum ipsi rerum alimentorum quidem quae alimentorum per navigiis quae adfluebant vehementer inediae copiis quidem Isauri solitarum ipsi vehebant ipsi adfluebant Isauri.
Alimentorum cibos tamen per propinquantis cibos solitarum ipsi ipsi frumenta frumenta cibos per clausos quae frumenta quod quae Isauri navigiis ipsi vero vehementer horrebant consumendo flumen angebat adfluebant flumen frumenta propinquantis Isauri flumen alimentorum quod copiis Isauri cibos per vehebant ipsi quae frumenta inediae alimentorum cibos frumenta alimentorum navigiis Isauri quae frumenta per clausos quidem solitarum tamen consumendo consumendo ipsi cibos Isauri adfluebant adfluebant solitarum angebat solitarum copiis flumen ipsi Isauri horrebant horrebant vehementer vero inediae clausos vehebant rerum ipsi rerum alimentorum quidem quae alimentorum per navigiis quae adfluebant vehementer inediae copiis quidem Isauri solitarum ipsi vehebant ipsi adfluebant Isauri.
Alimentorum cibos tamen per propinquantis cibos solitarum ipsi ipsi frumenta frumenta cibos per clausos quae frumenta quod quae Isauri navigiis ipsi vero vehementer horrebant consumendo flumen angebat adfluebant flumen frumenta propinquantis Isauri flumen alimentorum quod copiis Isauri cibos per vehebant ipsi quae frumenta inediae alimentorum cibos frumenta alimentorum navigiis Isauri quae frumenta per clausos quidem solitarum tamen consumendo consumendo ipsi cibos Isauri adfluebant adfluebant solitarum angebat solitarum copiis flumen ipsi Isauri horrebant horrebant vehementer vero inediae clausos vehebant rerum ipsi rerum alimentorum quidem quae alimentorum per navigiis quae adfluebant vehementer inediae copiis quidem Isauri solitarum ipsi vehebant ipsi adfluebant Isauri.
</div>
</div>
</body>
</html>
A voir également:
  • Border: Compatibilité IE et Firefox
  • Border maker - Télécharger - Retouche d'image

3 réponses

Réponse 1 / 3
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
15 avril 2008 à 12:45
salut,

essaie de définir la largeur.
avec 'inset' il doit falloir 3 pixels. 
#banniere
{
border-style: inset;
border-width: 3px;
border-color: white;
}
0
Réponse 2 / 3
kuuppp
15 avril 2008 à 13:07
Bon voilà regarde mon 
<a href="http://sportix.fr">Site</a>
.
J'ai plusieurs problèmes:
1) Pour les deux boites du haut je dois mettre des valeurs telles que 46.5% pour que ca marche, et dès que je mets 47% elle se met en dessous!! ya un moyen pour qu'elles restent collées?

2) Regardez la boîte centrale, comment je peux mettre un petit espace en haut?
j'ai pensé à padding-top, mais ca marche pas!
merci d'avance

3) Comment réglez les problèmes de compatibilité avec Internet Explorer parce-que le site ressemble a rien sous IE!!
merci merci
0
Réponse 3 / 3
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
15 avril 2008 à 13:19
en premier, vire tous les commentaires HTML de ton code CSS, mieux vaudrait mettre les styles dans une feuille de style à part. 
<style type="text/css">
body
{
background-color: black;
color: #FF7F50;
margin: 0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 1em;
}
#centre_gauche
{
width: 46.7%;
border: white;
border-style:groove;
border-width: 1px;
padding: 15px;
position: relative;
float: left;
}
#centre_droit
{
width: 47%;
position: relative;
border: white;
border-style: groove;
border-width: 1px;
padding: 15px;
float: right;
height: 20%;
}
#global
{
border: white;
border-style: groove;
border-width: 1px;
padding: 15px;
}
#banniere
{
border-style: groove;
border-width: 1px;
border-color: white;
}
#menu_haut
{
font-family: Comic Sans Ms;
color: white;
text-align: center;
border-color: white;
border-width: 1px;
border-style: groove;
}
#menu_haut a
{
text-decoration: none;
color: white;
}
#menu_haut a:hover
{
background: #FF7F50;
}
</style>

ensuite, valide ton code HTML.

une fois que tout sera clean on pourra se pencher sur la mise en page mais ça devrait déjà arranger les choses !
0

Discussions similaires

CSS Faire un Border invisible ET solide ?
Philippe P. -
cacalsof -

7 réponses
Border d'un button
parousky -
CptRomaiin -

3 réponses
Problème avec Border Layout
mar -
mar -

4 réponses
Comment faire disparaître ce cadre ??
luryx -
contrariness -

4 réponses