stop elements wrap in div

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.