Hi all, im attempting to make a div scroll horizontally on the page, depending on the amount of content it contains. As far as i can tell, this should work:

    .house-view .content
    float: left;
    margin-left: 20px;
    width: 615px;
    overflow-x: scroll;

the divs inside the scrolling div are styled like this:

    .house-view .content .house
    float: left;
    margin-right: 5px;
    width: 55px;

But the .content div never scrolls. When it is full, all of the .house divs just break onto a new line. Can anyone tell me where im going wrong?


1 answer

This was chosen as the best answer

You need to set a fixed height on the container div, and a min-height (or fixed) on the contained divs, otherwise the container will expand vertically to accommodate the extra content, as you have found.

Answered almost 7 years ago by Tony Crockford
  • Thanks, that does make sense, unfortunately ill have to come up with a different workaround, as the inner .house divs are generated dynamically, so i can never be sure of the height. Richard Crawley almost 7 years ago