您好,我有一个具有水平导航的 django 应用程序。最近发生了什么,我决定从我的 Windows 机器连接以使用我的应用程序。这就是我的水平导航如下所示。
出于某种原因,备份数据和帮助被移到了新行。但我希望这两个选项卡位于同一水平导航线中。我尝试使用不同的网络浏览器,但菜单看起来还是一样。
我能想到为什么会发生这种情况的一件事可能是我的决心,但我不确定。我的 windows 机器的屏幕分辨率为 1440 x 900,而我的 linux 机器的分辨率为 1024 x 768。
我想知道是否有让我所有的标签保持在同一行。可能需要添加一些CSS来做到这一点。
base_menu.html
<ul id="toc">
<li><a href="{% url mmc.views.return_clients %}"><span>Home</span></a></li>
<li><a href="{% url mmc.views.quote_step1 %}"><span>Create quote/order</span></a></li>
<li><a href="{% url mmc.views.search_item %}"><span> Item Search</span></a></li>
<li><a><span>Service orders</span></a><br/>
<ul class="subnav">
<li><a href="{% url mmc.views.order_list %}"><span>Storage orders</span></a></li>
<li><a href="{% url mmc.views.order_list_service 1 %}"><span>Delivery orders</span></a></li>
<li><a href="{% url mmc.views.order_list_service 2 %}"><span>Collection orders</span></a></li>
</ul>
</li>
<li><a><span>Collection/Delivery</span></a><br/>
<ul class="subnav">
<li><a href="{% url mmc.views.service_list 1 %}"><span>Delivery list</span></a></li>
<li><a href="{% url mmc.views.service_list 2 %}"><span>Collection list</span></a></li>
</ul>
</li>
<li><a href="{% url mmc.views.invoice_list %}"><span>Export for invoicing</span></a></li>
<li><a href="{% url mmc.views.dbbackup %}"><span>Backup data</span></a></li>
<li><a href="{% url mmc.views.help_index %}" target="_blank" onclick="return showAddAnotherPopup(this);"><span>Help</span></a></li>
</ul>
更新:base.css 文件
ul#toc {
height: 2em;
list-style: none;
margin-left: 200px;
padding: 0;
position relative;
}
ul#toc li{
background:#ffffff url(../images/tab.png);
float: left;
margin: 0 1px 0 0;
}
ul#toc span {
background: url(../images/tab.png) 100% 0;
display: block;
line-height: 2em;
padding-right: 10px;
}
ul#toc a {
color: #000000;
height: 2em;
float: left;
text-decoration: none;
padding-left: 10px;
}