删除<li>中的填充而不会打扰列表的其余部分</li>

Question

我将列表建立为侧栏，左侧填充为20px。 在我的列表的末尾，我插入一个图像，不希望20px影响我的图像。 如何仅为我的图像删除填充？

我尝试包含屏幕截图，但因为我是新用户，该功能已停用。

#sidebar li {
    margin-bottom: 40px;
    padding: 0 15px 0 20px;
}

<li>
    <h2>Follow</h2>
    <p><img src="../../Desktop/Root/_Images/follow.jpg" width="240" height="76" alt="Follow" /></p>
</li>

Answer 1

使用IMG或P的负偏移来补偿padding-left：

IMG {margin-left: -20px; }

或重置特定项目的填充，例如最后一个：

#sidebar LI:last-child {padding-left: 0; }

Answer 2

更具体的规则胜过CSS中不太具体的规则，因此您定义的任何样式都是：

sidebar li img {

将覆盖来自的继承者：

sidebar li {