Two unordered list side by side

I have two unordered list and I am trying to place them side by side. This works in Firefox, Safari and Chrome & IE8. But not IE 7 or compatibility mode.

Here's the markup:

<span>
   <ul style="list-style-type: none; display: inline-block;">
      <li>1</li>
      <li>2</li>
   </ul>

   <ul style="list-style-type: none; display: inline-block;">
      <li>3</li>
      <li>4</li>
   </ul>
<span>

Basically the expected is:

1  3
2  4