Expand div horizontally not vertically
css, html
Solution
You just need to set `white-space: nowrap` on either of the divs (the property is inherited). (Source)
Sidenote: The inner div is not necessary for this to work.
Demo: JSFiddle
HTML
<div class="container">
<div>
<!-- Thumbnails -->
</div>
</div>
CSS
.container {
display: block;
width: 348px;
overflow: hidden;
white-space: nowrap;
}
.container div {
position: relative;
display: inline-block;
}
Problem
I have a div with ``` display:inline-block; postion:relative; ``` inside a div with ``` display:block; width:348px; overflow:hidden; ``` When the contents of the inner div overflow, I want them to expand `horizontally`, not `vertically`. The contents of the inner div consists of thumbnails of photos