18041 sujets

Questions générales et questions de débutants

Petit problème alignement IE et Explorer

Bonjour

j'essaye en vain de faire en sorte que l'affichage soit identique sur IE et sur Firefox.

j'ai placé l'outil de recherche dans la barre de menu (de Raphaël GOETTER que j'ai trouvé ici).

Sur IE c'est bien aligné (pour une fois que c'est mieux que sur les autres !)
et sur firefox pas du tout.. dommage !

Résultat sur Internet Explorer
http://img81.imageshack.us/img81/4963/ie2gh0.jpg

Resultat sur FireFox

http://img95.imageshack.us/img95/2176/firefoxiu4.jpg


le code html

	</div>
	

	<div id="prelude">
		<ul class="menu"><li><a href="">Menu 1</a></li>
			<li><a href="">Menu 2</a></li>

			<li><a href="">Menu 3</a></li>
			<li><a href="">Menu 4</a></li>
			<li><form action="/index.php" method="get" class="search">
				<p>
					<label for="q" title="Saissez vos mots-clés dans le champ à droite"></label>
					<input name="q" id="q" size="15" value="" tabindex="1" title="Saisissez vos mots-clés dans ce champ" accesskey="4" type="text">
					<input value="ok" tabindex="2" title="Cliquez ici pour lancer la recherche" type="submit"></p>
			</form></li>
		</ul>	
	</div>



la feuille de style concernant l'objet

//le menu//

ul {
list-style-type: none;
width: 100%; /* précision pour Opera */
}

.menu li {
	float: left;

}

.menu a {
	width: 141px;
	height: 20px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: #000;
	margin-right: 3px;
	margin-left: 3px;

}

.menu a:hover {
	background-color: #919699;
}

.menu a:active {
background: gray; 
color: #fff;
}
.mentions {
font-family: verdana, arial, sans-serif;
position: absolute;
bottom : 300px;
left : 10px;
color: #000;
background-color: #ddd;
}
a.test {text-decoration: none;
color: #222;
}
a.test:hover{text-decoration: underline;
}


//la barre de recherche //
#sidebar div#search{

	background: transparent;
	color: inherit;
	line-height: 2.3em;
	background-color: #919699;
}

#search fieldset, #search p{

}

#q{
	padding-left: 4px;
	background: #fff;
	}




voilà si vous avez une idée
je vous remercie



(au passage j'en profite pour remercier ceux qui font vivre se site, en très peu de temps j'ai énormément appris ! bravo)
Modifié par trobador (14 Dec 2006 - 13:49)
Bonjour ...

Je crains que sans les éléments de mise en forme css, nous ne puissions t'être d'aucune aide ...
Cependant sache que les éléments de paragraphe ont tous des marges par défaut, à ta place je rechercherais de ce côté-ci.
D'ailleurs, pourquoi avoir insérer un paragraphe pour le champs de recherche ?!? Smiley rolleyes
Le label ne suffisait-il pas ?!?
Modifié par Cygnus (14 Dec 2006 - 13:44)
je vais voir ça
(je ne suis pas sûr d'avoir bien compris ... mais je vais essayer !)
merci

j'ai rajouté la feuille de style, de la barre de recherche et du menu
Modifié par trobador (14 Dec 2006 - 13:51)
Merci Cygnus
c'était bien ça



<div id="prelude">
		<ul class="menu"><li><a href="">Menu 1</a></li>
			<li><a href="">Menu 2</a></li>

			<li><a href="">Menu 3</a></li>
			<li><a href="">Menu 4</a></li>
			<li>
					<label for="q" title="Saissez vos mots-clés dans le champ à droite"></label>
					<input name="q" id="q" size="15" value="" tabindex="1" title="Saisissez vos mots-clés dans ce champ" accesskey="4" type="text">
					<input value="ok" tabindex="0" title="Cliquez ici pour lancer la recherche" type="submit">
</li>
		</ul>	
	</div>
Sujet clos
Aller à