Comment puis-je faire en sorte que chacun de ces éléments aille sur de nouvelles lignes, mais les conserve en tant qu'afficheur = inline et sans br?CSS: Causer des sauts de ligne pour les éléments en ligne sans <br />
<div>
<a href="element1">Element 1</a>
<a href="element1">Element 2</a>
<a href="element1">Element 3</a>
</div>
vous pouvez le faire en définissant égale width pour le parent et l'<div><a>. en supposant que vous appliquez une classe « conteneur » à la <div>
.container { width: 100px; }
a { width: 100px; display: inline; }
Les mettre dans une liste non-ordonnée?
Je ne sais pas, je comprends vraiment ce que vous êtes après ici ...
Si vous ne comprenez pas, ne répondez pas. – deathlock
<style type="text/css">
div.probablyShouldPutAClassName a {
display: block;
}
</style>
Cela peut se faire, mais ne fonctionnera pas pour tous les navigateurs. Vous devez utiliser le pseudo-élément :after avec white-space et content. Comme si
<html>
<head>
<style type="text/css">
div a:after {white-space: pre;content:'\A';}
</style>
</head>
<body>
<div>
<a href="element1">Element 1</a>
<a href="element1">Element 2</a>
<a href="element1">Element 3</a>
</div>
</body>
</html>
Cinq ans plus tard, la compatibilité avec les navigateurs n'est plus un problème, mais ce n'est toujours pas une solution universelle car il y a des éléments qui n'ont pas de pseudo-éléments :: before ou :: after - par ex. ''. – wortwart
Pour l'élément de bloc n'occupent toute la ligne, réglez sa largeur à quelque chose de petit et white-space:nowrap
label
{
width:10px;
display:block;
white-space:nowrap;
}
Pourquoi voudriez-vous les faire éléments en ligne mais ont des sauts de ligne après eux? C'est à peu près la définition de la différence entre les éléments de bloc et les éléments en ligne. –
Non, la différence entre les éléments de bloc et les éléments en ligne est plus subtile que cela. –
Je suppose qu'il veut les mettre sur des lignes différentes, et il est autorisé à changer le CSS mais pas le HTML. –