<span>
by definition is an inline element (so you use it inside a paragraph, for example), while <ul>
is a block element (which is its own little chunk of space, usually with space before/after it unlike <span>
).
Other people have had the same issue, and end up using <div>
tags instead. See Is it possible to put a list inside a span tag?