How to position ul list after a label?

Question

I would like to name my ul list with a label and place the ul list just after it and not below like the default. My ul list is in one line, so the result (label + list) should be in one line.

Here is what I have so far :

HTML:

<label>test :</label>
<ul>
    <li>word1</li>
    <li>word2</li>
</ul>

CSS:

ul {
    overflow-x:hidden;
    white-space:nowrap;
}

li {
    display:inline;
}

See: http://jsfiddle.net/72YA4/

Answer 1

Is that you what to achieve? http://jsfiddle.net/jslayer/72YA4/3/

ul {
    overflow-x:hidden;
    white-space:nowrap;
    display: inline-block;
    padding: 0;
    margin: 0;
    vertical-align: top;
}

li {
    display:inline;
}

label {
    display: inline-block;
    vertical-align: top;
}

Answer 2

Set display:inline; to ul as well

ul {
    overflow-x:hidden;
    white-space:nowrap;
    display:inline;
}

FIDDLE

Answer 3

Make the ul display inline and then align it

JSFiddle Demo

CSS

ul {
    overflow-x:hidden;
    white-space:nowrap;
    display: inline-block;
    vertical-align: middle;
}

li {
    display:inline;
}

Answer 4

This is the quickest fix I know for this:

ul{
position:absolute;
top:-8px;
}

hope this answers your question :)