Listelement與其他對齊

我有一個基於列表的導航欄。尋找這樣的：Listelement與其他對齊

我想知道我怎麼可以讓屏幕的右側網站上登出listpoint。我已經嘗試了添加清晰的listitems，但這只是一個骯髒的解決方法，並不適用於每個屏幕分辨率。

我的列表看起來像這樣：

<ul runat="server" id="tabs"> 
    <li class="test"> 
    <a href="DetailView.aspx?call=104"><span class="tab"> 
     <strong>EnterData</strong></span></a> 
    </li> 
    <li class="test"> 
    <a href="Overview.aspx"><span class="tab"> 
    <strong>Overview</strong></span></a> 
    </li> 
    <li class="test"> 
    <a href="Logout.aspx"><span class="tab"> 
    <strong style="text-align: right">Logout</strong></span></a> 
    </li> 
</ul>

我的問題是：我是否能夠得到這個項目嗎？如果這對列表不起作用，我會很高興看到一種不同的解決方案。我希望我能夠顯示我的問題可以理解。感謝您的回答！

來源

2015-10-19 Felix Gerber

您可以使用漂浮在列表項的地方登出的標題的右邊，我用最後一個孩子，但你可以創建另一個類或內嵌在其上慄：

.test:last-child{ 
    float:right; 
}

文本對齊也可以在li上運行，但是您需要指定li的寬度以使其看起來正確。

來源

2015-10-19 13:04:26 Benneb10

完美地爲我工作。謝謝！ –

試試這個：

<li class="test" style="text-align: right"> 
<a href="Logout.aspx"><span class="tab"><strong>Logout</strong></span></a> 
</li>

來源

2015-10-19 13:01:42 scoolnico

謝謝您的回答。這是行不通的。無論我把它放在列表項目還是列表的css部分。任何想法該怎麼辦？ –

看看布魯克的答案就在上面。這是一個更好，更好的方式來做你期望的。 – scoolnico

您必須對齊整個列表項目。這並不難;只需添加一些新類，如floatRight。

<ul runat="server" id="tabs"> 
     <li class="test"> 
     <a href="DetailView.aspx?call=104"><span class="tab"> 
      <strong>EnterData</strong></span></a> 
     </li> 
     <li class="test"> 
     <a href="Overview.aspx"><span class="tab"> 
     <strong>Overview</strong></span></a> 
     </li> 
     <li class="test floatRight"> 
     <a href="Logout.aspx"><span class="tab"> 
     <strong style="text-align: right">Logout</strong></span></a> 
     </li> 
    </ul>

而CSS：

.floatRight{float:right;}

你可以風格它內聯也一樣，如果你真的想：<li class="test" style="float:right;">

來源

2015-10-19 13:09:47

布魯克貝內特的答案很好，甚至更好。 –

Listelement與其他對齊

回答

相關問題