28172 sujets

CSS et mise en forme, CSS3

Affichage Firefox vs Chrome vs IE vs etc...

Bonjour,

Je voudrait savoir ou et le problème mais également la solution du problème d'affichage et de mise en forme CSS des formulaires, que se soit une zone de texte ou un bouton aucun navigateur n'applique les règles CSS que je mets, padding, margin et autres aucun n'affiche la même chose, si celui sur lequel je travail forcement Smiley biggol .

Alors me question est simple c'est une chose qu'aucun navigateur n'arrive à gérer après 10 ans ou alors j'ai loupé quelque chose essentiel pour qu'ils puissent afficher la même chose ?

Merci
Bonjour,

Je dirais que tu n'a pas de doctype (ou qu'il n'est pas correct).


Bon après, sans code, difficile de faire plus.
Sisi, j'ai un doctype, HTML5 Pour être précis.

Après pour le code c'est sur un Joomla!, mais le simple fait de vouloir mettre une hauteur les navigateur n'affiche pas la même chose...
Modifié par Boris56 (26 Aug 2011 - 17:53)
Je peu pas faire plus simple comme démonstration, la gestion du bouton n'est pas gérer de la même maniére chez Firefox et Chrome...

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Document sans nom</title>
</head>
<style>
input[type=text] {
	border: 1px solid #000;
	height: 20px;
	width: 150px;
	padding: 0;
	margin: 0;
}

input[type=button] {
	border: 1px solid #000;
	height: 20px;
	width: 75px;
	padding: 0;
	margin: 0;
}
</style>

<body>
<form>
	<input type="text" value="Textes...">
	<input type="button" value="Textes...">
</form>
</body>
</html>
Bonjour,

un input est de type inline par défaut, si je ne me trompe pas. Tu ne peux donc pas lui attribuer de dimensions ni d'espacements sans le passer en 
display:block;
.

Essaies simplement ça, pour commencer - mais une page qu'on puisse tester serait également appréciée Smiley cligne
Plutôt que block, inline-block, d'ailleurs. Car ca reste un inline, ton besoin est de lui préciser des dimensions.

A noter que les navigateurs s'amusent souvent à changer leur gestion du display des éléments de formulaire. Comme Safari sous Mac, pour un simple exemple...
Sujet clos
Aller à