The outside of the CSS does not wrap and the horizontal scroll bar is displayed.

I am not a professional front end, so toss long time AH Qaq

The requirement is two div, the inner Div does not wrap and the outer div shows the horizontal scroll bar when it is out.

This is similar to the following:

The first code is as follows:

<div class= "nowrap" >    <div class= "item-t" ></div>    <div class= "Item-t" ></div>    <div class= "item-t" ></div>    <div class= "Item-t" ></div></div>

CSS style:

. nowrap{White-space:nowrap;Overflow-x:Scroll;Height:200px;}. Item-t{Display:inline;float: Left;width:108px;Height:200px;background:Yellow;vertical-align:Top;}. Item-t+.item-t{Margin-left:15px;}

This is completely no way to meet the requirements, the White-space:nowarp as dead as not working, various experiments, the final version:

. Item-t　　{display: inline-block; width: 108px; height: 200px; background: yellow; vertical-align: top;}

I only posted the modified part, why add a float not, which master know to tell me, thank you!

The outside of the CSS does not wrap and the horizontal scroll bar is displayed.