28173 sujets

CSS et mise en forme, CSS3

[Résolu] Centrer mon site sous IE.

Bonjour tout le monde !

C'est mon premier poste, mais je suis lecteur fidèle de ce site, excellent !!

Alors voilà : J'ai appris ici à me débarasser des tableaux pour les DIV, quelle merveille ! Mais j'ai eu une jolie surprise lorsque je suis passé sur IE ...

J'ai donc repris le tuto, mais j'ai le même problème ... Or je ne vois pas de cas particulier IE à la fin de ce tuto ...

En gros, voici mon code (mega simplifié) :

<html>

<head>
<title>Création d'un design à 2 colonnes - 1. Le code XHTML</title>
<style type="text/css">
<!--
    html, body {
        margin: 0;
    }
    div#global {
        width: 750px;
        padding: 0 10px;
        margin: 0 auto;
        position: relative;
    }
    div#center {
        padding-bottom: 50px; 
        overflow: auto;
    }
    div#content {
        float: left;
        width: 530px;
    }
    div#sidebar {
        float: right;
        width: 200px;
    }	
-->
</style>
</head>

<body>
    <div id="global">
        <div id="header">
            <h1>2cols4u</h1>
        </div>
        <div id="center">
            <div id="content">
                <h2>Etape 1 : le code XHTML</h2>
                <p>Vous trouverez ci-dessous le code de la page HTML que vous êtes en train de lire.</p>
                <ol>
                    <li>l'en-tête (identifié par "<em>header</em>"), destiné à accueillir la bannière et éventuellement une devise ou slogan.</li>
                </ol>
            </div>
            <div id="sidebar">
                <h3>Navigation</h3>
                <ul id="menu">
                    <li><a href="./" title="Introduction">Introduction</a></li>
                    <li><a href="etape1.html" title="Première étape">Etape 1</a></li>
                    <li><a href="etape2.html" title="Deuxième étape">Etape 2</a></li>
                </ul>
                <h3>Brèves</h3>
                <p>Pourquoi j'aime les standards du W3C</p>
            </div>
        </div>
    </div>
</body>

</html>

Donc sous FF, c'est exactement comme je le veux ... centré ... Mais sous IE 6.qqchose ... Non, il est tout à gauche.

Si quelqu'un a une idée, ce serait super mega sympa ! Smiley biggrin

Merci beaucoup et encore bravo pour ce site, ce forum et les inscrits !
Modifié par Shu (27 Nov 2006 - 17:12)
mets sur ton calque à centrer margin-right:auto et margin-left:auto, à condition que son conteneur ait une largeur fixée.
Salut,

tu peux déclarer un text-align: center; pour l'élément body, et ensuite le rétablir à left pour #global Smiley cligne
Malcolm a écrit :
mets sur ton calque à centrer margin-right:auto et margin-left:auto, à condition que son conteneur ait une largeur fixée.

Merci, mais cela ne marche pas. En gros, j'ai mis auto à margin left et right sur la DIV global, qui contient donc tout le site.
SuD a écrit :
Salut,

tu peux déclarer un text-align: center; pour l'élément body, et ensuite le rétablir à left pour #global Smiley cligne

AHAH ! Merci beaucoup ! Une bonne grosse bidouille que je ne comprend pas du tout, mais elle fonctionne nickel !

Encore merci !
Bonjour,

Ben c'est tout bon à condition de changer ton doctype ...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">


Par exemple, sinon IE passe en mode minimum ...quirk mode

<edit> il vaut mieux changer ton doctype, sinon tu risques d'avoir d'autres soucis de portabilité entre FF et IE</edit>
Modifié par ghost (27 Nov 2006 - 17:19)
Ah ouais !

Mais je ne connais pas du tout tous ces paramètres, en effet, cela marche très bien ! Et a l'air beaucoup plus réglo ! Smiley langue

Merci !
Sujet clos
Aller à