Question

I use < li > for every shop element to show buttons.
but every < li > begins on new line so i use float: left to avoid this.

html:

<div id="main" >    
    <li><div id="block"><img src="blabla"></div></li>
    <li><div id="block"><img src="blabla"></div></li>
    <li><div id="block"><img src="blabla"></div></li>
    <li><div id="block"><img src="blabla"></div></li>
    <li><div id="block"><img src="blabla"></div></li>
</div>

css:

#main{
    margin: 0px auto;
    width:940px;
    }


#block {
    height:286px;
    width:312px;
    white-space: nowrap;
    vertical-align:middle;
    display:table-cell;
    overflow: hidden;
    border-collapse: collapse;
    }

li {
        list-style-type:none;
        vertical-align:top;
        float:left;
        white-space: nowrap;
        width:313px;
        }

but

I have

I need:

Answer 1

Give #main overflow:auto and enclose your LI elements within a UL tag.

Also you are using the same ID multiple times which should not be done. You should use a class instead of an ID if you want to use it like this. An ID is a unqiue tag that can only be used once per page.