bonjour, je suis en train de coder un site.

j'ai un problème que je n'ai jamais rencontré auparavant.

dans ma <div violet> qui est centrer : margin 0 auto;

je voudrais mettre deux colonnes: la rose et la bleu ciel.

j'applique donc

float left a la <div colonne rose>
flaot right a la <div colonne bleu>

premier chose bizarre : j'ai le background de la div violet qui disparait.

sachant que tous au un width défini
et je n'arrive pas a faire correctement cette action.

quelqu'un à déjà eu ce problème ?

11 réponses


AlexStarck
Auteur
Réponse acceptée

bonsoir, merci pour ton aide.

Effectivement c'était un problème à une erreur syntaxique.

il fallait aussi ferme les div avec des clear: both.

Merci de votre aide :)

Si tu pouvais mettre tes codes HTML/CSS ca nous arrangerai, parce que là c'est un peu confus !

wrapper= violet
col = rose
sidebar= violet

<div id="wrapper">
<div id="col">
</div><!-- FIN #col -->

<div id="sidebar">
<div id="sidebar-top"></div>
<div id="sidebar-menu"></div>
</div>

</div><!-- FIN #wrapper -->

wrapper{width: 1088px;background: url("img/draw.png") top left no-repeat;margin: 0 auto;text-align: left;} wrapper #col{width:800px;float: left;} wrapper #sidebar{width: 150px;border-radius: 0px 0px 30px 0px;float: right;}

body {
font-family:"American Typewriter", cursive, trebuchetMS, sans-serif;
font-size: medium;
font-size: 12px;
text-align: center;
}

ca sera un peu plus claire comme ca désolé :)

Pourquoi tu as mis :

#wrapper #col{
width:800px;
float: left;
}
#wrapper #sidebar{
width: 150px;
border-radius: 0px 0px 30px 0px;
float: right;
}

Et non pas :

#col{
width:800px;
float: left;
}
#sidebar{
width: 150px;
border-radius: 0px 0px 30px 0px;
float: right;

Essaye de changer ca déjà, sinon tu as un lien on peut voir ? :)

http://www.weshfamilymovie.com/test/blog/

voila je te laisse jeter un coup d'oeil car la je comprend plus, entre safari et firefox j'ai deux chose complément différentes?

Ok merci, et donc explique exactement ton soucis maintenant qu'on a la page sous les yeux :)

le comportement de la div col et sidebar est très bizarre, j'arrive pas a faire exactement je que je veux.

je pense que c'est le script Wordpress qui génère cela.

je voudrais simplement deux éléments les posts col a gauche et les sidebars a droite avec un background dans le wrapper.

le col se déplace bizarrement sans respecter le CSS et le background disparait quand les deux élements sont en float?

tu as une idée. parceque j'ai suivis exactement le tuto présenté sur le site mais il réagit pas de la même façon?

suis-je assez clair ?

Non pas trop, enfin pour ma part je comprend pas.
Tu as peut être ton design sous forme non codé pour nous montré le résultat attendu ? :)

Salut Alex,

essaye d'ajouter une div avec un clear both après tes 2 div qui sont en float. Comme ça :

<div id="wrapper">
    <div id="col">
    </div><!-- FIN #col -->
    <div id="sidebar">
        <div id="sidebar-top"></div>
        <div id="sidebar-menu"></div>
    </div>
    <div style="clear:both;"></div>
</div><!-- FIN #wrapper -->

oui j'ai fait ca

ton lien marche pas ! Le probleme est-il résolu ?