Stop Div going to new line on resizing

Suppose I am having a webpage in

the webpage is having some

|XXXXXXXXXXXX| //Suppose each alphabet is representing a div. |YYYYYYYYYYYY|

|ZZZZZZZZZZZZ|

Now when I resize my window, all div are going to next line. Like this.

---

|XXXXXX|
|XXXXXX| |YYYYYY| |YYYYYY| |ZZZZZZ|

|ZZZZZZ|

Thus, creating a really awful presentation. Whereas I want it like this.

---

|XXXXXX| XXXXXX |YYYYYY| YYYYYY

|ZZZZZZ| ZZZZZZ

That is, 1) No new line is formed 2) The content represented outside the box must stay like that i.e hidden 3) I have tried using float:left, display:inline || inline-block. nothings work

Is there is way to help me out. Please help

Thanks in Advance