HTML multiple column select list

Question

generally html list is created,

<select size=6 name="sel" id="sel">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="4">5</option>
    <option value="4">6</option>
    <option value="4">7</option>
    <option value="4">8</option>
    <option value="4">9</option>
</select>

but it is displaying as,

1
2
3
4
5

instead i want to be it as,

1   2   3   4
5   6   7   8
9   .........

or

1   3   5   7
2   4   6   8

how to display it without using any "pluggins" and "jquery" etc.. just want to do in pure javascript, html, css way

.........

Answer 1

This is not possible with a <select> input. Try something like this, to get you started: http://jsfiddle.net/spryno724/z67w9/5/

<ul>
  <li>
    <ul>
      <li>1</li>
      <li>2</li>
    </ul>
  </li>

  <li>
    <ul>
      <li class="selected">3</li>
      <li>4</li>
    </ul>
  </li>
</ul>