J'ai une liste d'éléments LI dans une étiquette ultérieure. Je souhaite afficher les deux derniers dans une nouvelle ligne, si la largeur de l'écran est inférieure à 625px. Le code suivant fonctionne parfaitement bien:
p>
<style>
.NewLine { display: none; }
@media screen and (max-width: 625px) { .NewLine { display: block; }}
li { float: left; }
ul { list-style: none; }
</style>
<ul>
<li>...</li>
<li>...</li>
<p class="NewLine"></p>
<li>...</li>
<li>...</li>
</ul>3 Réponses :
Pourquoi ne pas l'envelopper dans
Exactement, et vous n'avez même pas besoin d'avoir le paragraphe. Il suffit d'ajouter la classe au
Ne fonctionne pas sans le paragraphe, sauf si vous définissez la hauteur
Li avec un P classé ne fonctionne pas, ni avec un nbsp; À l'intérieur, voir jsfiddle.net/mcdk0w3z/9
Vous pouvez utiliser un pseudo élément pour créer une nouvelle ligne entre Affichage: Bloc Code> P> P >
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
J'aime votre première approche, car avec la déclaration de hauteur, je peux régler l'espacement de la ligne.
Puisque vous utilisez du float, effacez simplement le flotteur après le deuxième élément et que vous n'avez pas besoin d'élément supplémentaire ou pack em>. p>
<ul>
<li>AAA</li>
<li>BBB</li>
<li>AAA</li>
<li>BBB</li>
</ul>
Faites-le avec ?