DIV that doesn't wrap

Home Forums Tech Web Development DIV that doesn't wrap

Tagged: , , , ,

This topic contains 0 replies, has 1 voice, and was last updated by  congoPongo 6 years, 7 months ago.

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #5094

    congoPongo
    Participant

    This minimalist example will not wrap DIV2 into a second line. Both DIV1 and DIV2 will stay on the same line:

    <div style="white-space: nowrap;"> 
        <div style="display: inline-block;"> DIV1 </div>
        <div style="display: inline-block;"> DIV2 </div>
    </div>

    Here is an output:

    DIV1 DIV2

    Here are the requirements:
    -1- your container DIV should have white-space: nowrap;
    -2- each of your cell DIV(s) should have display: inline-block;

    Why this is important? – When you need to modify existing HTML, but you only have access to CSS.

    RE:
    – prevent DIV from wrapping to next line
    – 2017-09-20 WE 10:33

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.