Horizontal overflow does not work

Basically I have a column within a container to display times like a TV guide and by adding in each hour i.e. 13:00 to 14:00, the time goes onto the next line as opposed to allowing me to scroll horizontally, its hard to explain it basically displays 5 hours of times from 5am to 1pm and then goes to the next line as opposed to continuing on and allowing me to scroll horizontally I have to drag the mouse on the time like Im copying and pasting in order to see the times below. Below is the CSS at the moment, I've tried every overflow option and it hasn't had any effect.

If anyone has any ideas please let me know

#top {
    width: auto;
    height: 50px;
    white-space: nowrap; 
}