skip to Main Content

Is it possible to break a text at some width for the first line and no break for the second line?

for instance breaking the following text "Is it possible to break a text at some width for the first line and no break for the second line" like this First Line:-Is it possible to break a text Second line:-at some width for the first line and no break for the second line"

2

Answers


  1. You can put "Non breaking space" in the position of the spaces of the 2nd line. It will hold them together.

    at some width for the first line and no break for the second line
    
    Login or Signup to reply.
  2. You can add an invisible (= without content, border or background) right-floated element before that text, with height: 1em and width: calc(100% - 300px) where you can adjust the px value to the desired width of the first text line:

    .x {
      float: right;
      width: calc(100% - 300px);
      height: 1em;
      border: 1px dotted #ddd;
    }
    <div class="x"></div>
    <p>Is it possible to break a text at some width for the first line and no break for the second line. Is it possible to break a text at some width for the first line and no break for the second line. Is it possible to break a text at some width for the first line and no break for the second line. Is it possible to break a text at some width for the first line and no break for the second line.</p>

    Note: I created a very light border for the floated element to make it visible for demonstration purposes, but you can simply delete that border setting to keep the element invisible.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search