How to fix maximum width of a div? If contents of that div's exceeds than maximum width, we get scroller?

Tags: html,css

Problem :

I have #maindiv and i am putting divs in that programmatically. So i never know how much inner div will be inside #maindiv. every inner div has width: 160px. I used this css for #maindiv:

 #maindiv
 {
   overflow: auto;
   width: 640px; 
   height: 65px;
   background:lightblue;
 } 

I want #maindiv to make horizontal scroller when total of innerdivs width is more than 160px. My css is not giving me right results. I am not getting any horizontal scroller even i fixed the width of the div. If i have innerdivs with more width that #maindiv then they make #maindiv wider. I even used max-width:160px for #maindiv as well. any Idea? Thanks in advance.

---

Solution :

You could try using

overflow-y: scroll;

See http://jsfiddle.net/4CCfy/