Si vous avez un balisage comme ceci:
<div class="inlineblock">one</div><div class="inlineblock">two</div><div class="inlineblock">three</div>
4 Réponses :
C'est exactement ce qu'ils devraient em> faire. p>
Les espaces entre les éléments en ligne ne sont pas différents des espaces entre les mots. P>
Si vous ne voulez pas cela, utilisez des éléments de bloc ou définissez la taille de la police à zéro. P>
Exactement, tout comme lorsque vous faites a span> b span> code> vous attendez ab code> et non ab code> AB Et quand vous écrivez "Bonjour World", vous vous attendez à "Hello World" et non "helloworld"
Merci, je ne pensais pas à cela comme ça, je pensais surtment à la façon dont je détestais le regard de mon balisage, mais je suppose que la taille de police hack suffira. Acclamations.
Eh bien, il y a des espaces entre eux! P>
Pour un correctif, essayez d'utiliser Taille de la police: 0 code> dans l'élément parent. P>
Il y a une meilleure façon d'éliminer l'espace blanc que de régler la taille de la police à zéro (comme cette méthode a des effets secondaires désagréables). Vous pouvez un espacement de texte à la place:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
section {
word-spacing:-.25em; /* hide whitespace nodes in all modern browsers (not for webkit)*/
display:table;/* Webkit Fix */
}
div {
width: 100px;
height: 40px;
background: #e7e7e7;
padding: 10px;
display:inline-block;
word-spacing:0; /* reset from parent*/
}
</style>
</head>
<body>
<section>
<div>one</div>
<div>two</div>
<div>three</div>
</section>
</body>
</html>
C'est la solution.
<style>
* {
border:0;
margin:0;
padding:0;
box-shadow:0 0 1px 0px silver;
}
.foo {
width: 100%;
}
.bar {
width: 50%;
float:left;
text-align: center;
}
</style>
<div class="foo">
<div class="bar">
...a new customer
<!-- the whitespace between the following divs affects rendering - why? -->
</div> <div class="bar">
...an existing customer
</div>
</div>
Pourquoi pas? Les éléments de bloc en ligne sont programmés pour apparaître en ligne avec du texte. S'il y a du texte entre, il devrait être rendu.
N'avez-vous pas remarqué la faute (en fait, ce n'est pas un échec) dans la navigation parcourue, pourquoi la plupart d'entre eux ne pouvaient pas rester complètement "en ligne". Ce n'est pas un échec, je vous recommande d'utiliser CSS-RESET. Lisez ma réponse: Stackoverflow.com/questions/16698142/...
@Guilherme Nascimento Je ne sais pas pourquoi vous faites une discussion sur les vieux navigateurs et leurs lacunes. Cela n'avait rien à voir avec la question.
@deweydb Je ne fais pas une discussion, j'explique que ce n'est pas une faute. Lisez ma réponse que j'ai modifiée.
@GuilherMenascimento Je ne sais pas pourquoi vous pensez qu'une réinitialisation CSS a quelque chose à voir avec la question sous une forme ou une forme. Cela ne va pas faire de la blancheure disparaître entre les éléments inline- *. Je trouve que c'est drôle que vous essayez de soutenir votre position "Utiliser une réinitialisation CSS" avec un article indiquant pourquoi les réinitialisations CSS sont mauvaises.