How to avoid space on the right side of a line in HTML?

Question

The right endings of each line should align perfectly like the left ends, instead of the case above. Help!

score 3 · Accepted Answer · answered Dec 18 '16 at 14:03

You can simply use text-align: justify:

div {
  width: 300px;
  text-align: justify;
}

<div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata
  sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
  Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>

See MDN for more information.

score 1 · Answer 2 · answered Dec 18 '16 at 14:03

1

Use text-align: justify. This will make the lines full width.

answered Dec 18 '16 at 14:03

Ionică Bizău

109,027
88
289
474

score 1 · Answer 3 · answered Dec 18 '16 at 14:06

1

Select the parent element in CSS. For example if this is the parent element:

<p id="text-container"> Your text... </p>

Then:

#text-container {
  text-align: justify;
}

will do you the job.

answered Dec 18 '16 at 14:06

Wais Kamal

5,858
2
17
36

How to avoid space on the right side of a line in HTML?

3 Answers3