消除我网站上的随机填充元素

Question

我的 Squarespace 网站上有一些自定义代码。我知道这不是 Squarespace 论坛，但我不知道如何在我的自定义 CSS 中只针对一个特定元素。

这是网站：http://www.roboticsrookie.com/

我试过将#main-navigation a.folder {padding: 0px};在我的网站范围内 CSS，但它被证明是无效的。任何提示将不胜感激。

问题似乎是 Squarespace 生成了一个带有填充的空导航 link，但我想出了如何摆脱特定元素的填充。

Screen shot

Answer 1

这不是 "padding"，它是一个锚标记，可能是用来放置下拉菜单图标的。

如果可能，删除那里的空锚标记。

<li aria-haspopup="true" class="folder-collection folder">
<a href="#" onclick="return false;"></a> <!-- < this anchor is the space -->
<a href="http://www.roboticsrookie.com/reviews/">Reviews</a>
<span class="delimiter">/</span>
<div class="subnav">
<ul>
<li class="page-collection"><a href="/robotics-reviews/">Robotics Reviews</a></li>
<li class="page-collection"><a href="/book-reviews/">Book Reviews</a></li>
<li class="blog-collection"><a href="/reviews/">Reviews</a></li>
</ul>
</div>
</li>

或添加CSS：

li.folder-collection.folder > a:nth-child(1) { display: none;}

这应该删除第一个空锚点。

您 css select 或者是错误的。 #main-navigation a.folder 正在寻找带有 class "folder" 的锚标记。换句话说 <a class="folder" href="#"></a>.

您拥有的是一个列表项，其中包含 class 文件夹和该列表项中的锚标记。或者 <li class="folder-collection folder"><a href="#"></a></li>.

你不能（轻易地）定位那个特定的锚点，因为它没有什么独特之处。锚点没有 class 或 id apples，并且该列表项中还有其他锚点。所以你需要使用更具体的selector，比如nth-child，来select它。

消除我网站上的随机填充元素

Eliminate Randomly Padded Element on My Site

html

css

padding