28220 sujets

CSS et mise en forme, CSS3

Modérateur
Bonjour,

En vue d'améliorer ma syntaxe, j'aurais souhaité savoir si le code suivant était sémantiquement correct où si l'on pouvait encore l'améliorer?
<!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" lang="fr">
<head><title>Exemple de mise en page</title>
<meta http-equiv="Content-Type" content="text/html; CHARSET=iso-8859-15" />
<style type="text/css">
<!--

* {
margin: 0; padding: 0; }

body {
padding-left: 20px; }

#conteneur {
margin-top: 20px; /*Pour IE*/
width: 440px; height: 500px; background: #EEE; }

.zone {
position: relative; left: 20px; margin-top: 20px; background: #FFD; width: 400px; height: 100px; }

html>body .zone { top: 20px; } /*Pour FF*/

.bouton {
background: #DDF; float: right; width: 100px; height: 100px; }

.vignette {
background: #DFD; float: left; width: 100px; height: 100px; }

.centre {
float: left; text-align: right; width: 200px; height: 100px; }

h1 {
font-size: 1em; height: 19px; background: #FDD; border-bottom: 1px solid #000; }

//-->
</style>

</head><body><div id="conteneur">

<!-- zone 1 -->

<div class="zone">

<img src="" alt="" class="vignette" />
<div class="centre"><h1 class="titre">photo 1</h1>
<p>blabla</p>
<p>blabla</p>
</div>
<img src="" alt="" class="bouton" />

</div>

<!-- zone 2 -->

<div class="zone">

<img src="" alt="" class="vignette" />
<div class="centre"><h1 class="titre">photo 2</h1>
<p>blabla</p>
<p>blabla</p>
</div>
<img src="" alt="" class="bouton" />

</div>

<!-- zone 3 -->

<div class="zone">

<img src="" alt="" class="vignette" />
<div class="centre"><h1 class="titre">photo 3</h1>
<p>blabla</p>
<p>blabla</p>
</div>
<img src="" alt="" class="bouton" />

</div>

<!-- zone 4 -->

<div class="zone">

<img src="" alt="" class="vignette" />
<div class="centre"><h1 class="titre">photo 4</h1>
<p>blabla</p>
<p>blabla</p>
</div>
<img src="" alt="" class="bouton" />

</div>

</div></body></html>


dois-je réécrire une feuille de style pour me débarasser de la ligne spéciale FF dans mon css?

Merci. Smiley smile
Modifié par koala64 (24 Jun 2005 - 15:20)