Hello!

How to align the text immediately and on the left and on the right? For example, I have the text:

Sample example - 111 abc SomeExample Sample - 2222 abc

And what would be needed like this:

 Sample example - 111abc SomeExample Sample - 2222abc
  • Maybe it would be necessary to place such text in the table, not divmi !!! - Anton Belyakov

2 answers 2

Place the right-justified text on the span with float:right; . The whole line, in turn, is wrapped in a div .

For example:

 <div style="width:200px;"> <p>Sample example - <span style="float:right">111abc</span></p> </div>

  • this is understandable, but what if my text is in a separate file, where it is better not to push html tags because users can commit a string, and there is not one line and many lines of text? - hovdev
  • @ S1lllver in this case, when you get the text from a separate file, place it in such <p> blocks. Those. Received the text - formatted it as you need it and shoved it where you need it, but do not hold it in this html file, but generate it during output. - Ep1demic

Align the text (without additional markup in it) along both edges by text-align: justify; :

 .text-justify { text-align-last: justify; text-align: justify; } .text-justify:after { content: ""; display: inline-block; width: 100%; } .example { width: 300px; } 
 <div class="example text-justify"> Sample example - 111 abc <br/> SomeExample Sample - 2222 abc </div> <div class="example text-justify"> <p>Sample example - 111 abc</p> <p>SomeExample Sample - 2222 abc</p> </div>

Or look at the code on jsfiddle

  • and you can issue an example? I just can't understand how text-align: justify will help in this case; - soledar10
  • Yes, of course - added the answer. :after element is needed so that the multiline (through <br/>) text is correctly aligned. - Vitaly Emelyantsev