CODEWITHSUNDEEP
htmlcss
Demetrius
Demetrius

Reputation: 451

Can you add an indent inside a p element?

Can you add an indent within a p element? I keep adding spaces between words but only one space is added. I do not want to create a new line with a br tag but rather multiple spaces between words.

Ex:

enter image description here

Upvotes: 1

Views: 359

Answers (4)

SteffPoint
SteffPoint

Reputation: 559

Concerning your demand: I would suggest you to create a table with hidden grid lines:

table {
  table-layout: fixed;
  width: 100%;
}

td {
  width: 33%;
  font-weight: bold;
}
<table cellspacing="10">
  <tr>
    <td>McNair Scholar</td>
    <td>Member</td>
    <td>Spring 2017-Present</td>
  </tr>
  <tr>
    <td>Code2040 Fellow</td>
    <td>Fellow</td>
    <td>Summer 2017</td>
  </tr>
</table>

Upvotes: 2

mipurale
mipurale

Reputation: 57

Sandwich your text in the <pre></pre> tag and include the spaces/indents normally.

<pre>McNair Scholar           Member          Spring 2017-Present</pre>
<pre>Code2040 Fellow          Fellow          Summer 2017</pre>

Upvotes: 0

Ouroborus
Ouroborus

Reputation: 16875

p elements are meant for paragraphs. Your example is definitely not a paragraph so you'll need to use other elements to assemble it.

There are several ways to do what your asking. One of those ways is:

.grid {
  display:grid;
  grid-template-columns: 50% 25% 25%;
}
<div class="grid">
  <div>McNair Scholar</div><div>Member</div><div>Spring 2017-Present</div>
  <div>Code2040 Fellow</div><div>Fellow</div><div>Summer 2017</div>
</div>

Upvotes: 1

doğukan
doğukan

Reputation: 27411

try with white-space:pre-wrap;

p {
  white-space:pre-wrap;
}
<p>a              b                                       c</p>

Upvotes: 0

Related Questions