在某些文本後添加填充/空白

我正在嘗試自定義Wordpress.com網站（屬於客戶端）中的菜單。在某些文本後添加填充/空白

的網址是：https://chainecharlotteorg.wordpress.com/

它是沿着網站頂部的主導航欄。

我可以添加一個CSS類到菜單項。使用那個類，我改變了背景顏色。但是我希望背景至少在manu項目文本的前後有空間。填充沒有效果。

通過將width定義爲比文本更寬的東西，我能夠在文本之前獲得空間。這具有在文本前創建空間的效果。如圖所示：

但我一直無法找到一種方法來設置後，「捐」，這樣的藍色背景超出了它的一些空間。我會認爲填充會做到這一點，但在這種情況下，它不會。

從前端，這裏涉及的代碼：

<nav id="site-navigation" class="main-navigation" role="navigation"> 
<div class="menu-nav-menu-container"> 
<ul id="primary-menu" class="menu nav-menu" aria-expanded="false"> 
<li id="menu-item-157" class="donate menu-item menu-item-type-post_type menu-item-object-page menu-item-157"> 
<a href="https://chainecharlotteorg.wordpress.com/donate/">Donate</a> 
</li> 
<li id="menu-item-122" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-122"> 
<li id="menu-item-37" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-37"> 
<li id="menu-item-141" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-141"> 
<li id="menu-item-140" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-140"> 
<li id="menu-item-93" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-93"> 
<li id="menu-item-101" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-101"> 
<li id="menu-item-38" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-38"> 
</ul> 
</div> 
</nav>

以下的（從）作爲代碼具體到「捐」菜單項：

<li id="menu-item-157" class="donate menu-item menu-item-type-post_type menu-item-object-page menu-item-157"> 
<a href="https://chainecharlotteorg.wordpress.com/donate/">Donate</a> 
</li>

沒有人有有什麼建議麼？

來源

2016-04-03 inspirednz

你的網址，我可以快速瀏覽一下別的一個的jsfiddle將是一件好事？ –

添加URL。它是https://chainecharlotteorg.wordpress.com/ – inspirednz

所以你想讓它們更分散或左邊的空間不見了？因爲這是一個元素之前呢？讓我知道你想要什麼，並將我的答案粘貼在下面 –

代碼片段是任何人真正幫助你以及理解這個問題的唯一方法。嘗試

margin-right: 30px;

來源

2016-04-03 02:22:11 Maxwelll

這些都在wordpress.com網站的嚴格範圍內。所以我懷疑我沒有正常的方式訪問代碼。但我懷疑從前端檢查代碼（查看https://chainecharlotteorg.wordpress.com/）可能會揭示你的後代。保證金和填充不起作用。我假設他們不是職業水平的屬性，但塊級別？（對不起，如果我的CSS術語不正確）。 – inspirednz

那麼，作爲超級明顯，因爲這是，該解決方案是使用!important屬性，以我的課爲主屬性上的wordpress.com主題的其它地方定義（我夠不着）。

以下，因此，現在作爲我本來期待：

.donate { 
    padding: 20px !important; 
    background: blue; 
}

來源

2016-04-03 02:45:05 inspirednz

在某些文本後添加填充/空白

回答

相關問題