How to get Floating DIVs inside fixed-width DIV to continue horizontally?

Question

I have a container DIV with a fixed height and width (275x1000px). In this DIV I want to put multiple floating DIVs each with a width of 300px, and have a horizontal (x-axi

Answer 1

#row {
    white-space: nowrap; /* important */
    overflow: auto;
}

.items {
    display: inline-block;
}

The trick here is the "white-space: nowrap" property of the parent which simply tells all it's child elements to continue horizontally and the "display: inline-block" property of it's children. You don't need to add any other property to make this work.

JS Fiddle: http://jsfiddle.net/2c4jfetf/