Comment éviter une nouvelle ligne avec le tag p?

Question

Comment puis-je rester sur la même ligne tout en travaillant avec <p> tag?

Answer 1

Utilisez le display: inline Propriété CSS.

Idéal: Dans la feuille de style:

#container p { display: inline }

Mauvaise/extrême situation: Inline:

<p style="display:inline">...</p>

Answer 2

Le <p> balise de paragraphe est destinée à spécifier des paragraphes de texte. Si vous ne voulez pas que le texte commence sur une nouvelle ligne, je vous suggère d'utiliser le <p> tag incorrectement. Peut-être le <span> _ tag correspond mieux à ce que vous voulez atteindre ...?

Answer 3

Je suis tombé dessus pour css

span, p{overflow:hidden; white-space: nowrap;}

via question similaire de stackoverflow

Answer 4

quelque chose comme:

p
{
    display:inline;
}

dans votre feuille de style le ferait pour tous les tags p.

Answer 5

La Flexbox fonctionne.

.box{
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-content: center;
  align-items:center;
  border:1px solid #e3f2fd;
}
.item{
  flex: 1 1 auto;
  border:1px solid #ffebee;
}

<div class="box">
  <p class="item">A</p>
  <p class="item">B</p>
  <p class="item">C</p>
</div>