Search code examples
htmlcssautogrow

How to force my text to not break into lines in css?

I have a div inside another fixed width div. I want inner div can grow horizontally until in can contain all of it's elements or texts in one line. doesn't matter to create a horizontal scroll bar. what should I do? this is my sample code:

<div style="width:400px;border:solid 1px red;">
    TEST TEXT
    <div style="border:solid 3px green;position:absolute;z-index:99;text-overflow:">
        TEST INSIDE TEST INSIDE TEST INSIDE TEST INSIDE TEST INSIDE
        TEST INSIDE TEST INSIDE TEST INSIDE TEST INSIDE TEST INSIDE
    </div>
</div>
Solution

  • Use white-space: nowrap; for text to not break on white-spaces