28172 sujets

CSS et mise en forme, CSS3

[Résolu] Problème décalage texte à cause d'un div

Bonjour,

J'ai un souci assez dérangeant qui apparaît sous Firefox et sous Chrome.
J'ai réalisé une page web qui est contenu dans un div "main" qui fait 960px et qui est en margin-left et margin-right auto.
Avant ce div, j'ai fait un autre bloc div pour pouvoir changer de langue. Je l'ai mis en float right.
Sur Chrome, Safari, mobiles, mon "main" est bien centré sur ma page.
Par contre, sous Firefox et Chrome, mon "main" est légèrement décalé vers la gauche (du nombre de px que fait mon bloc de switch de langue).

Comment remédier à cela?

Voici une partie de mon code HTML:

<body>
  <div id="polyglotLanguageSwitcher">
    <form action="url">
	  <select id="polyglot-language-options">
	    <option id="fr" value="fr" selected>Fran&ccedil;ais</option>
  	    <option id="en" value="en">English</option>
	  </select>
    </form>
  </div>
  <div id="main">
    <!--Contenu de ma page web-->
  </div>
</body>


Et voici une partie de mon CSS:

#polyglotLanguageSwitcher
{
	float: right;
}

#main
{
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	color: rgb(150,25,20);
	font-weight: bold;
	font-size: 17px;
	overflow: hidden;
	padding-bottom: 15px;
}


PS: voici ma page web http://www.i-philately.com/
Modifié par Yuuko (20 Jul 2012 - 12:47)
Salut,

Tu devrais utilisé le positionnement absolut qui fera sortir l'élément du flux.

Typiquement :

#polyglotLanguageSwitcher {
position: absolute;
right: 0; top: 0;
}


En espérant t'avoir éclairé Smiley smile
Gili a écrit :
Salut,

Tu devrais utilisé le positionnement absolut qui fera sortir l'élément du flux.

Typiquement :

#polyglotLanguageSwitcher {
position: absolute;
right: 0; top: 0;
}


En espérant t'avoir éclairé Smiley smile


Merci Ca marche niquel! Smiley smile
Modifié par Yuuko (20 Jul 2012 - 12:47)
Sujet clos
Aller à