How to store images in a horizontal table?

How to store images in a horizontal table?

I am trying to store a few images I have in the header of a site
horizontally in a line.. I was told the easiest way to do this is be
making a table so thats what i did:
<ul id="nav">
<li id="our-story"></li>
<li id="whats-new"></li>
<li id="coming-soon"></li>
<div style="table">
<div style="table-row">
<li id="facebook" style="table-cell">...</li>
<li id="twitter" style="table-cell">...</li>
<li id="instagram" style="table-cell">...</li>
<li id="email" style="table-cell">...</li>
<li id="youtube" style="table-cell">... </li>
</div>
</div>
</ul>
only problem is, nothing happens. They stay where they are at and remain
vertical of each other! What am i doing wrong?