css - Align items within a div?

Question

I am trying to stay away from tables because I am told they are to be used for tabular data only. However, I am confused as to how to implement this functionality. My navigation bar has a search button, register link, login link, and two dividers. How would one align each item within the div much like one can with tables? Please excuse my newbieness to CSS =P

Answer 1

<ul class="menu">
 <li>Link 1</li>
 <li>Link 2</li>
 <li>Link 3</li>
 <li>Link 4</li>
</ul>

<style type="text/css">
   .menu {margin:0px;padding:0px;list-style:none;width:600px;margin:auto}
   .menu li {display:inline;padding:5px;margin-right:10px;background-color:#333;color:#fff}
</style>

私はそれをテストしていませんが、これはあなたが探しているものをあなたに与えるはずです。上記のコードを試して、要件に合わせて微調整してください。そして、ええ、テーブルは常に避ける必要はありません。表形式のデータを表示するには、表が最適なオプションです

Answer 2

初心者の方は、このツールをお試しください。 http://accessify.com/tools-and-wizards/developer-tools/list-o-matic/