La mise en page de mon site en CSS marche très bien sous Safari, sur IE certains éléments du css ne marche pas et sur Firefox le CSS n'est pas pris en compte. Voici mes codes :
J'appelle le CSS :
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="monsite.com/fichiers/site/design/principal.php" />
Le CSS avec des variables que j'importe de _variables.php :
<?php
header("Content-type:text/css_body; charset=iso-8859-1");
include ('../../../fichiers/site/_variables.php');
echo('
body {
background:url(' . $body_fond_chemin . ') no-repeat center top;
background-color:#' . $body_fond_couleur . ';
color:#' . $body_ecriture_couleur . ';
font-family:' . $body_font_family . ';
font-size:' . $body_font_size . 'pt;
margin:' . $body_margin . 'px;
text-align:' . $body_text_align . ';
}
a {
color:#' . $a_ecriture_couleur . ';
text-decoration:' . $a_ecriture_decoration . ';
}
a:hover {
color:#' . $a_hover_ecriture_couleur . ';
text-decoration:' . $a_hover_ecriture_decoration . ';
}
img {
border:' . $img_bordure . 'px;
}
#conteneur {
margin-left:' . $conteneur_marge . ';
margin-right:' . $conteneur_marge . ';
width:' . $conteneur_largeur . 'px;
}
.texte {
padding-left:' . $texte_marge . 'px;
padding-right:' . $texte_marge . 'px;
}
#logo {
width:' . $conteneur_largeur . 'px;
}
#colonne {
float:' . $float . ';
width:' . $colonne_largeur . 'px;
}
.colonne_haut {
background-image:url(' . $colonne_haut_img_chemin . ');
width:' . $colonne_largeur . 'px;
height:' . $colonne_haut_hauteur . 'px;
}
.colonne_milieu_menu {
background-image:url(' . $colonne_milieu_img_chemin . ');
width:' . $colonne_largeur . 'px;
height:' . $colonne_milieu_hauteur . 'px;
}
.colonne_milieu_autres {
background-image:url(' . $colonne_milieu_img_chemin . ');
width:' . $colonne_largeur . 'px;
}
.colonne_bas {
background-image:url(' . $colonne_bas_img_chemin . ');
width:' . $colonne_largeur . 'px;
height:' . $colonne_bas_hauteur . 'px;
}
#corps {
float:' . $float . ';
width:' . $corps_largeur . 'px;
margin-left:' . $separation_marge . 'px;"
}
.corps_haut {
background-image:url(' . $corps_haut_img_chemin . ');
width:' . $corps_largeur . 'px;
height:' . $corps_haut_hauteur . 'px;
}
.corps_milieu {
background-image:url(' . $corps_milieu_img_chemin . ');
width:' . $corps_largeur . 'px;
}
.corps_bas {
background-image:url(' . $corps_bas_img_chemin . ');
width:' . $corps_largeur . 'px;
height:' . $corps_haut_hauteur . 'px;
}
#bas {
width:' . $conteneur_largeur . 'px;
}
.menu {
margin: 0;
padding: 0;
list-style: none;
text-align:justify;
}
.menu a {
display: block;
padding: 4px 10px;
text-decoration: none;
}
.menu .sousmenu {
font-size: 10pt;
margin: 0;
padding: 0;
list-style: none;
}
.menu ul.sousmenu a {
background: none;
color:#525252;
padding: 3px 20px;
}
');
?>
Si vous savez pourquoi
