求助!这一段网页如何把他改成横向?
<div class="aside">
<h1 class="logo">
<img src="images/logo.png"></h1>
<div class="nav">
<ul>
<li><span><a href="javascript:getPic(0,'');">
<img src="images/category_00.png"></a></span> </li>
<li id="cate1"><span><a href="javascript:getCate(1)">
<img src="images/category_01.png"></a></span>
<ul>
<%--<li>
<span><a href="#">上装</a></span>
<ul>
<li><a href="#">上衣</a></li>
<li><a href="#">外套</a></li>
</ul>
</li>
<li>
<span><a href="#">下装</a></span>
<ul>
<li><a href="#">裤子</a></li>
<li><a href="#">裙子</a></li>
</ul>
</li>
<li>
<span><a href="#">连衣裙</a></span>
</li>
<li>
<span><a href="#">饰品</a></span>
<ul>
<li><a href="#">包包</a></li>
<li><a href="#">鞋子</a></li>
<li><a href="#">其它</a></li>
</ul>
</li>--%>
</ul>
</li>
<li id="cate2"><span><a href="javascript:getCate(2)">
<img src="images/category_02.png"></a></span>
<ul>
<%--<li>
<span><a href="#">职场</a></span>
</li>
<li>
<span><a href="#">社交</a></span>
</li>
<li>
<span><a href="#">休闲</a></span>
</li>--%>
</ul>
</li>
<li id="cate3"><span><a href="javascript:getCate(3)">
<img src="images/category_03.png"></a></span>
<ul>
<%--<li>
<span><a href="#">单品</a></span>
</li>--%>
</ul>
</li>
<li id="cate4"><span><a href="javascript:getCate(4)">
<img src="images/category_04.png"></a></span>
<ul>
</ul>
</li>
<li id="cate5"><span><a href="javascript:getCate(5)"></a></span>
<ul>
</ul>
</li>
<li id="cate6"><span><a href="javascript:getCate(6)"></a></span>
<ul>
</ul>
</li>
</ul>
</div>
<div class="bottom-nav">
<div class="search">
<h3>
按编号搜索</h3>
<div class="search-box">
<input type="text" id="word" placeholder="请输入款号" />
<a href="javascript:search()" style="cursor: hand;"></a>
</div>
</div>
<ul>
<%--<li><a href="javascript:void()"><img src="images/category_08.png"></a></li>--%>
<li><a href="index.aspx?img=0">
<img src="images/category_10.png"></a></li>
<li><a href="index.aspx?type=1">
<img src="images/category_09.png"></a></li>
<li><a href="javascript:;"></a></li>
<li><a href="javascript:;"></a></li>
</ul>
</div>
</div>
折腾了两天只会把大框横向,这些导航就不会了