在不破壞的情況下掩蓋div區域的完整空間

Question

不確定如何描述此內容。相反，下面的圖片可能會說清楚。

這是我有：

這是我要如何展現它（看看滿格覆蓋面積達）：

HTML結構：

<ul class="block"> 
    <li class="item"><a href="#">Item</a></li> 
    <li class="item"><a href="#">Item</a></li> 
    <li class="item"><a href="#">Item</a></li> 
</ul> 

演示：https://jsfiddle.net/6f2t2bew/

Answer 1

li標籤的默認顯示類型爲list-item，這會導致每個li從新行開始。正如你在你的圖片中顯示的，你希望第三個li不是從換行開始，而是從第二個li加入的位置開始。對於設置

.block li { 
    display: inline 
} 

編輯：你給浮動留給li S的導致他們像那種塊級和表現得像這往往去到左單元li開始的全部內容。爲了避免這種刪除浮動左爲：
https://jsfiddle.net/6f2t2bew/1/

此外，如果你想要的文字更加充分的理由再申請text-align: justify父ul。

Answer 2

您在代碼的第一行寫了'clas'。嘗試將其更改爲'class'。

Answer 3

您是否試圖刪除float: left您的li？當然在@ user31782建議的元素上使用display: inline;。

所以你的.footer-top li CSS的樣子：

.footer-top li { 
    list-style-type: none; 
    margin: 0; 
    color: #d9d9d9; 
    position: relative; 
    display: inline; 
}