Questions sur le css et le xhtml

12 avril 2006 à 11:31:11

Bonjour à tous grands et valeureux zeros,

Je recherche pour mon site le moyen le plus fiable et le meilleur pour presenter mon site web(tableau,div...).Lorsque 'utilise les divs la fonction float ne marche pas sur Internet Explorer et pour les tableaux je ne m'y connait pas assez pour que sa fonctionne

merci de votre aide et de vos reponses si gentillement proposer.

Hoho93,zero depuis peu de temps.

Phnx

12 avril 2006 à 11:36:11

les DIV oui les tableau non :-°

hoho93

12 avril 2006 à 11:38:04

Citation : hoho93

Lorsque j'utilise les divs la fonction float ne marche pas sur Internet Explorer

strucky

12 avril 2006 à 13:27:33

Salut,

Le float fonctionne bel et bien sur IE.

Peut-on voir ton code html/css ?

Deeder

12 avril 2006 à 14:11:51

Les divs non, les tableaux encore moins...

Le fait est que la sémantique doit être respectée. Il ne sert à rien de remplacer chaque <table> par un <div>. Il faut donner du sens au code en utilisant des balises appropriées, que ce soient des <p>, des <ul>, des <bloquotes> ou que sais-je encore...

Anonyme

12 avril 2006 à 14:18:33

Bonjour,

+1 Deeder... tout à fait d'accord.
Les tableaux, c'est non surtout

.
De plus, remplacer tous les <table> par des <div> n'est pas beaucoup mieux. Il faut utiliser la balise appropriée dans chaque cas, et il y en assez pour arriver à un bon résultat

.
Les float qui ne fonctionnent pas avec Internet Explorer, cela me surprend car ça devrait fonctionner... Peut-on voir ton code?
Une erreur classique, comme c'est dit dans le cours de M@teo21, est de mettre l'élément flottant après le texte. Ton problème avec les flottants ne vient-il pas de ça?

Au revoir.

hoho93

12 avril 2006 à 17:09:03

Voici mon code xhtml:

<!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>Empire Naruto: Personnages</title></head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <link rel="stylesheet" media="screen" type="text/css" title="Design sombre" href="body.css" />
</head>
<body>

<div id="en_tete"></div>
<div id="menu">
<div class="element_menu_haut"></div>
   <div class="element_menu">
   <img src="images/design_04.gif">
   <ul>
<li><a href="index.php">Acceuil</a></li>
   <li><a href="proposer.php">Proposer</a></li>
   <li><a href="archives.php">Archives</a></li>
   </ul>
</div>
<div class="element_menu">
   <img src="images/design_11.gif">
   <ul>
<li><a href="page1.htm">Personnages</a></li>
   <li><a href="page1.htm">Legende</a></li>
   <li><a href="page1.htm">Armes</a></li>
   </ul>
</div>
<div class="element_menu_bas"></div>
</div>
<div id="corps">
Voici ma page 1, retour; la page d'accueil :<a href="index.php">ici</a>
</div>
</body>
</html>

Voici mon code css:

body
{
width: 750px;
margin: auto;
margin-bottom: 20px;
background-repeat: repeat-x;
background-image: url(".jpg");
background-attachment: fixed;
background-color: #A5F4F3;
}

#en_tete
{
width: 720px;
height: 120px;
margin-top: 20px;
margin-bottom: 20px;
background-image: url("banniere.jpg");
background-repeat: no-repeat;
}

#menu
{
width: 183px;
text-align:left;
float: left;
}

.element_menu_haut
{
width: 149px;
height: 24px;
background-repeat: no-repeat;
background-image: url("images/design_02.gif");
}

.element_menu_bas
{
width: 183px;
height: 35px;
background-repeat: no-repeat;
background-image: url("images/design_10.gif");
}

.element_menu
{
padding-top:0px;
height: 130px;
background-image: url("images/design_14.gif");
background-repeat: repeat-y;
}

.element_menu li
{
list-style-image: url(".gif");
list-style-type: square;
}

.element_menu a
{
font-size:0.7em;
color: black;
font-family: Comic Sans MS, Times, serif;
text-decoration: none;
}

.element_menu a:hover
{
font-size:0.7em;
font-family: Comic Sans MS, Times, serif;
color: blue;
text-decoration: none;
}

#corps
{
width: 520px;
color: black;
background-image: url("");
background-repeat: repeat-x;
font-family: Comic Sans MS, Times, serif;
font-size:0.8em;
margin-left: 190px;
}

#corps h1
{
color: black;
text-align: center;
font-family: Comic Sans MS, Times, serif;
}

#corps h2
{
height: 30px;
background-image: url("");
background-repeat: no-repeat;
padding-left: 30px;
color: black;
text-align: center;
font-family: Comic Sans MS, Times, serif;
}

#corps a:hover
{
font-family: Comic Sans MS, Times, serif;
font-size:0.9em;
color: blue;
text-decoration: none;
}

#corps a
{
font-family: Comic Sans MS, Times, serif;
font-size:0.9em;
color: black;
text-decoration: none;
}