28172 sujets

CSS et mise en forme, CSS3

Bordure input, bordure ahref

Bonjour,

Je n'arrive pas à comprendre pourquoi les bordures de ces 2 boutons (le premier avec un lien ahref, et l'autre avec un input) ne réagissent pas de la même manière.
Le submit a des bordures à l’intérieur, et le ahref a des bordures à l’extérieur.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
	<head>
		<title></title>
		<style type="text/css" >
		
		a, input {
			height: 30px; 
			line-height: 30px; 
			width: 120px;
			text-decoration: none;
			background-color: orange;
			border: 3px solid #000000;
			display: inline-block;
			text-align: center;
			color: #000000;
		}
		</style>
	</head>
	
	<body>
		<p>
		<input type='submit' value='Submit' />
		<a href='#'>a href</a>
		</p>
	</body>
</html>


Si vous avez une idée, je suis preneur.
Merci,

Gilou.
Modifié par gillesgallais (07 Apr 2012 - 21:43)
Bonsoir, la question de pourquoi un élément de formulaire fait un peu ce qu'il veut quand je veux le styler, revient régulièrement...
Chaque navigateur gère les éléments à sa sauce, du coup il est difficile de trouver un rendu identique...en tout cas en CSS, il existe des solutions en javascript qui posent également d'autres problèmes.

Un peu de lecture : Comment ne pas styler les éléments de formulaire ?
Ok, merci pour cette réponse.
J'ai finalement compensé en faisant des styles avec des "height" différents pour ahref et input.

A bientôt.
Sujet clos
Aller à