How to avoid a new line with the 'p' tag

HtmlCssTags

Html Problem Overview

How can I stay on the same line while working with the <p> tag?

I want to create a carousel with an image and text.

Html Solutions

Solution 1 - Html

Use the display: inline CSS property.

Ideal: In the stylesheet:

#container p { display: inline }

Bad/Extreme situation: Inline:

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

Solution 2 - Html

The <p> paragraph tag is meant for specifying paragraphs of text. If you don't want the text to start on a new line, I would suggest you're using the <p> tag incorrectly. Perhaps the <span> tag more closely fits what you want to achieve...?

Solution 3 - Html

I came across this for CSS,

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

via a similar Stack Overflow question.

Solution 4 - Html

Something like

p
{
    display: inline;
}

in your stylesheet would do it for all p tags.

Solution 5 - Html

Flexbox works.

.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>

Categories
Recommended Html Solutions
Recommended Css Solutions
Recommended Tags Solutions

Previous Solution:

Are there any CSV readers/writer libraries in C#?

C#Csv

Next Solution:

Alter MySQL table to add comments on columns

MysqlAlter Table

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJoshView Question on Stackoverflow
Solution 1 - HtmlDoug NeinerView Answer on Stackoverflow
Solution 2 - HtmlSteve HarrisonView Answer on Stackoverflow
Solution 3 - HtmlackushiwView Answer on Stackoverflow
Solution 4 - HtmlJohn BokerView Answer on Stackoverflow
Solution 5 - HtmlRonnie RoystonView Answer on Stackoverflow