使跨度填充標記

我有引導標記與a標記包含span元素與glyphicon類。但是，我無法將span圖形設置爲可擴展至a標籤可用寬度的整個範圍。這裏是我的代碼：使跨度填充標記

HTML：

<a class='app-nav--links' href='#'> 
    <span class="glyphicon glyphicon-music" aria-hidden="true"></span> 
</a>

SCSS：

.app-nav { 
    .app-nav--links { 
     display: inline-block; 
     width: 60px; 
     & span { 
     width: 100%; 
     display:inline-block; 
     } 
    }

任何想法？

來源

2017-10-14 IsaaK08

您是否嘗試過爲'span'元素聲明'display：block'？ – UncaughtTypeError

是的，不起作用... – IsaaK08

您顯示的代碼有效（一旦SCSS轉變爲CSS），因此它必定是導致問題的其他內容。究竟發生了什麼？你能否創建一個工作片段來說明這個問題？ [如何創建一個可運行的代碼片段]（https://stackoverflow.blog/2014/09/16/introducing-runnable-javascript-css-and-html-code-snippets/） – FluffyKitten

好吧，我通過將font-size添加到span標籤解決了它。這裏的代碼：

.app-nav { 
    .app-nav--links { 
     display: inline-block; 
     width: 60px; 

     span { 
     width: 100%; 
     font-size: 50px; 
     } 
    }

來源

2017-10-14 15:40:26 IsaaK08

你的代碼實際上使跨度填充標籤。如果你想增加glyphicon的大小，你應該增加它的font-size。

來源

2017-10-14 15:45:52 Cons7an7ine

ops。看起來你已經知道了:)好工作！ – Cons7an7ine

使跨度填充標記

回答

相關問題