如何使標籤和輸入文本內聯

Question

我正在對我的表格進行分頁。

我需要帶有文本「30」的標籤內嵌輸入文本。

我該怎麼做？

這裏是小提琴的鏈接：

https://jsfiddle.net/uwom05mc/2/

// MARKUP

<nav> 
     <ul class="pagination" style="margin: 0px !important;"> 
     <li><a href >First</a> 
     </li><li><a href>&lt;</a> 
     </li> 
     <li> 
      <a> 
      <input type="text" class="select-page form-control" id="pagenav" class="form-control"> 
      <label>of 30</label> 
      </a> 
     </li> 
     <li><a href>&gt;</a> 
     </li><li><a href>Last</a></li> 
     </ul> 
</nav> 

Answer 1

除了爲了對#pagenav設置display: inline-block輸入旁邊的文本顯示，你也是Ø需要調整包含元素的高度和邊距：

#pagenav { 
    display: inline-block; 
} 

.pagination>li>a { 
    height: 34px; 
} 

.pagination li a input { 
    height: 26px; 
    margin-top: -7px; 
} 

我創建了一個更新的小提琴展示這個here。

希望這會有所幫助！ :)

Answer 2

嘗試：

#pagenav { 
    display: inline-block; 
}