table 里面 div ul li 怎么排版呀

图片说明

我的代码贴出来
这是结构部分

    <tr>
                                            <td width="15%" nowrap align="right" height="100">取穴:</td>
                                            <td colspan="3" id="xueweiTd">
                                                <div id="nav">

                                                    <ul id="xueweiList"></ul>
                                                    <input id="xueweis" name="xueweis">

                                                </div> 
                                            </td>

                                        </tr>

这是css样式部分

 <style type="text/css">
.ul, li {
    list-style: none;
}

#nav li {
    display: inline-block;
    margin: 0 5px;
    background: #ccc;
    padding: 0px 0px;
    line-height: 24px;
    font-size: 12px;
    float:left;
}

#nav li.h_nav_over {
    background: red;
    color: #fff;
}

#nav li.h_nav_over a {
    color: #fff;
}

a {
    text-decoration: none;
}
</style>

想实现这样的效果：
图片说明

能说清楚点怎么分布么，这个样子不知道需求就不知道怎么弄呀。

就是按照这样来排列

感觉能起到参考作用，效果是这样的:

主要是display:teble-cell;属性的使用

 <html>
    <head>
        <title></title>
        <style>
            .content{
                width:30%;
                border:1px #cccccc solid;
                }
            ul{
                display:table;
                height:30px;
                width:500px;
                }
            li{
                display:table-cell;
                border:1px solid #666666;
                padding:5 5 0 5;
                }
        </style>
    </head>
    <body>
        <div class="content">
            <ul>
                <li>星期一</li>
                <li>星期二</li>
                <li>星期三</li>
                <li>星期四</li>
                <li>星期五</li>
                <li>星期六</li>
            </ul>
            <ul>
                <li>星期一</li>
                <li>星期二</li>
                <li>星期三</li>
                <li>星期四</li>
                <li>星期五</li>
                <li>星期六</li>
                <li>星期日</li>
                <li>星期四</li>
                <li>星期五</li>
                <li>星期六</li>
            </ul>
        </div>
    </body>

</html>

成这样的效果了

<div id="...">
<ul>.... ....</ul> 
<li>.... ....</li>
</div>