Q:

stop elements wrap in div

Suppose I have 15 images, which I want to display in a div.
So, I add them dynamically using JQuery.
But the output is

The css for the above image is
.item
    {
        float: left;
        width: 120px;
        height: 120px;
        background-image: url('images/txt.png');
        background-repeat: no-repeat;
        background-position-x: center;
    }

and css for div is :
#fileName
    {
            margin-top: 10px;
    }

so I tried the following css :
#fileName
        {
            margin-top: 10px;
            overflow-x : auto;
        }

then my o/p is :

I have also tried overflow-wrap css property. But still I cant solve my problem.
I want to have all the images in one line and if it does not fit the div then div should have a horizontal scrollbar.

A:

Try using this on the parent:
white-space:nowrap;

and display: inline-block; instead of floats

