The div width is not wrapping the line-break text

Question

HTML

<div class="wrapper">
  <div class="tag">
    TestTestTestTest TestTestTestTestTestTest TestTestTest
  </div>
</div>

CSS

.wrapper {
  max-width: 250px
}

.tag {
  vertical-align: top;
  background-color: red;
  padding: 3px;
  text-align: left;
  font-size: 12px;

  color: white;
  display: inline-block;
}

You can see there is some space after the first line, How to set the width of div fit the content ? The current width should be the width of break-all not break-word

Current

[Test Test Test    ]
[Test              ]

Expected

[Text Text Text]  // Keep Break word and the width fit the content
[Text          ]

Here is the jsfiddle https://jsfiddle.net/1f9atmwu/

its because of `max-width: 250px` – Vitorino fernandes Dec 19 '19 at 06:55 — Vitorino fernandes, Dec 19 '19 at 06:55

score -2 · Answer 1 · answered Dec 19 '19 at 07:06

-2

i think also you can use flex box and use flex-wrap

answered Dec 19 '19 at 07:06

Islam Elamer

15
1

Can you give me the example ? Thanks – Pete Dec 19 '19 at 07:34

The div width is not wrapping the line-break text

1 Answers1