Overflowing a list horizontally

Question

So I have an unordered list where I'm trying to have the li's overflow horizontally, but whenever they hit the boundary they just go below on a newline. Any suggestions on how to get around this?

Answer 1

ul {
    white-space:nowrap;
}
li {
    display:inline;
}

Answer 2

You can use white-space property with display:inline-block like this:

ul {
 white-space:nowrap;
}
li {
 display:inline-block
 *display:inline;/* IE7 */
 *zoom:1;
 white-space:normal;
}