Bonjour à tous, j'ai découvert ce site il y'a deux jours et il m'a décidé à refaire la page d'accueil du site que je réalise pour mon stage, mais sans tableaux...
Je me suis donc mis à l'ouvrage mais après plusieurs heures de recherche je reste bloqué sur un problème d'affichage.
Le problème est que le site s'affiche come je le souhaite sous Firefox, mais pas du tout sous IE, voici le site.
Le CSS:
et le code principal:
Je débute, merci d'être indulgent
Je compte faire une version avec flash et une sans pour les utilisateurs équipés de connexions bas débit. Si vous avez des suggestions au niveau du code ou du design n'hésitez pas, toute remarque me sera utile
Merci
Fred
EDIT : Autre petite question, je n'arrive pas à faire apparaître le bloc "titre" au dessus du bloc "gauche", je crois que je ne comprend pas l'attribut z-index...
Modifié par Nakuni (23 Mar 2006 - 00:56)
Je me suis donc mis à l'ouvrage mais après plusieurs heures de recherche je reste bloqué sur un problème d'affichage.
Le problème est que le site s'affiche come je le souhaite sous Firefox, mais pas du tout sous IE, voici le site.
Le CSS:
.contenu {
margin-left: auto;
margin-right: auto;
width: 798px;
height: 100%;
background-color:#01014B;
background-image:url(images/damier.jpg);
background-repeat:repeat-y ;
}
.entete {
margin-left: auto;
margin-right: auto;
width: 798px;
height: 250px;
}
.titre {
position: absolute;
z-index: 2;
}
.gauche {
position: absolute;
z-index:1;
}
.centre {
margin-left: 150px;
width: 648px;
height:100%;
}
body {
font-family: arial, Tahoma, Verdana, sans-serif;
font-size: 16px;
color: white;
background : black;
margin: 0; /* pour éviter les marges */
text-align: center; /* pour corriger le bug de centrage IE */
}
a {
font-family: arial, Tahoma, Verdana, sans-serif;
font-size: 13px;
color : #F7BF02;
text-decoration: none;
}
a:visited {
font-family: arial, Tahoma, Verdana, sans-serif;
font-size: 13px;
color : #F7BF02;
text-decoration: none;
}
a:hover {
font-family: arial, Tahoma, Verdana, sans-serif;
font-size: 13px;
color : blue;
text-decoration: none;
}
table {
background: #01014B;
font-family: arial, Tahoma, Verdana, sans-serif;
}
a.mod {
text-decoration:none;
color : #F7BF02;
}
a:visited.mod {
text-decoration: none;
color : #F7BF02;
}
a:hover.mod {
text-decoration: none;
color : #F7BF02;
}
.important {
color: red;
}
/*#01014B bleu kln
#F7BF02 jaune kln*/
et le code principal:
<?php
//si aucun contenu spécifié, contenu par defaut
if (isset($_GET['content'])) {
$content = $_GET['content'];
}
else {
$content = 'accueil';
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="fr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="kln.css" />
<title>nom de la société</title>
</head>
<body>
<!--___________________________________Menu____________________________________________-->
<div class="contenu">
<div class="entete">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="798" height="250" id="act" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="images/but_act.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="bgcolor" value="#01014b" />
<embed src="images/but_act.swf" quality="high" wmode="transparent" bgcolor="#01014b" width="798" height="250" name="act" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>
<!--____________________________________Partie gauche______________________________________-->
<div class="gauche">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,22,0" height="327" width="150" id="LOGO">
<param name="movie" value="images/logo.swf">
<param name="quality" value="high">
<embed src="images/logo.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" height="327" width="150"> </embed>
</object>
<br /><br />
<img src="./images/pilote.gif"></div>
<!--________________________________________________Titre______________________________________-->
<div class="titre">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="798" height="90" id="pocket" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="images/titres/<?php echo ("$content.swf"); ?>" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="bgcolor" value="#01014b" />
<embed src="images/titres/<?php echo ("$content.swf"); ?>" quality="high" wmode="transparent" bgcolor="#01014b" width="798" height="90" name="pocket" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>
<!--________________________________________________Contenu principal___________________________-->
<div class="centre">
<?
echo ("<br /><br /><br /><br /><br /><br /><br /><br /><br />");
include("$content.php");
?>
</div>
</div>
</body>
</html>
Je débute, merci d'être indulgent
Je compte faire une version avec flash et une sans pour les utilisateurs équipés de connexions bas débit. Si vous avez des suggestions au niveau du code ou du design n'hésitez pas, toute remarque me sera utile
Merci
Fred
EDIT : Autre petite question, je n'arrive pas à faire apparaître le bloc "titre" au dessus du bloc "gauche", je crois que je ne comprend pas l'attribut z-index...
Modifié par Nakuni (23 Mar 2006 - 00:56)