28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Encore un éniiiiiiiième sujet sur les compatibilités entre navigateurs. Je vous explique brièvement, je me suis mis en tête de réaliser un thème pour Wordpress et là je viens de finir le découpage et avant de m'apprêter à l'intégrer à Wordpress, j'ai voulu vérifier les compatibilités avec IE 6 et là, bien entendu, un bon bug m'arrive dans la gueule. Visiblement c'est pas trop grave, c'est mon menu qui se met en dessous du bloc de contenu au lieu de se mettre gentiment à droite.

La structure c'est du float avec un bloc contenu sur la gauche et un autre sur la droite. La version actuelle est compatible avec IE 7/8, FF 1/2, Opera, Safari et passe très bien sur quelques autres. Je ne retrouve ce problème que sur IE 6 donc.

Voici quelques extraits de code :

<div id="container">

<div id="header">
<h1><a href="">Le blog de Monsieur X</a></h1>
<h2><a href="">Chroniques de formidables épopées</a></h2>
</div>

<!-- Bloc de contenu (liste billets, page etc.) -->

<div id="content-bloc">

<! -- Les billets -->

</div>

<!-- Ouverture de la fameuse sidebar -->

<div id="sidebar">

<!-- Mes liens -->

</div>

<!-- Fermeture du container -->

</div>


Les grandes lignes de la CSS :


html, body {
margin: 0;
padding: 0;
}

#container {
width: 980px;
margin: 0 auto;
}

#header {
background-image: url(images/header.jpg);
margin: 0;
}

#sidebar {
float: left;
width: 324px;
}


Voici pour les très grandes lignes, pour voir la chose plus en profondeur, il faut vous rendre ici : http://blog.guillaumeringuenet.info/test/rainbow/

A noter que je suis pas un intégriste de la validation, disons que j'ai fait mon truc à moi en essayant d'assurer au mieux la compatibilité donc certaines choses peuvent vous choquer mais j'accepte les critiques, alors n'hésitez pas à m'hurler dessus Smiley cligne .

Merci !

<modération : j'ai modifié un terme utilisé pour éviter toute polémique, merci de ta compréhension. />
Modifié par Mikachu (08 Apr 2008 - 12:49)