jquery - div で要素のラップを停止する

Question

divに表示したい15枚の画像があるとします。そのため、JQuery を使用して動的に追加します。

しかし、出力は

上の画像のcssは

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

divのcssは次のとおりです。

#fileName
    {
            margin-top: 10px;
    }

だから私は次のcssを試しました：

#fileName
        {
            margin-top: 10px;
            overflow-x : auto;
        }

次に、私のo / pは次のとおりです。

overflow-wrapcssプロパティも試しました。しかし、それでも私は自分の問題を解決できません。

すべての画像を1行に表示したいのですが、divに収まらない場合は、divに水平スクロールバーが必要です。

Answer 1

親でこれを使用してみてください：

white-space:nowrap;

フロートのdisplay: inline-block;代わりに

Answer 2

display: inline-blockあなたのためにそれをします。