为文本而不是图像添加填充答案

【问题标题】：Add padding to text but not images为文本而不是图像添加填充
【发布时间】：2014-05-24 13:36:57
【问题描述】：

我正在尝试制作一个 Tumblr 主题，并尝试使文本远离边框 20 像素，但它也将照片、视频和其他不是文本的元素推到了上面，这是应该做的，是有没有办法只对齐文本？

        .posts {
            border:solid 1px #333333;
            border-radius:15px 15px 15px 15px;
            color:black;
            margin-bottom:20px;
            min-height:120px;
            padding-left:20px;
            text-align:left;
        }

这是我的代码。

http://puu.sh/83iTL.jpg

这就是正在发生的事情，但我只想对齐文本。这可能吗？

谢谢:)

编辑：整个代码：http://pastebin.com/6q4hFyZL，页面是 em202020.tumblr.com

【问题讨论】：

您应该将文本包装在它自己的类中，然后只将填充应用于该类。
如果您在不想离开边框的照片和视频等元素上添加负左边距（-20px）怎么办？
为您的文本创建一个类，并像 Alex 所说的那样为该类应用填充
如果这是我的最后一个选项，那么我会的，不过这需要一段时间，因为我需要将它添加到 tumblr 拥有的每种类型的帖子中：s 谢谢 :)跨度>
给我们您页面的链接，以便我们看到生成的 html 并可以清楚地为您提供建议。您的 HTML 丢失了，我们猜不到？

标签： html css alignment padding

【解决方案1】：

<edit>

来自您的页面：http://em202020.tumblr.com/

你可以这样做：

.posts   a:first-of-type img,
.posts iframe {
margin-left:-80px;
}

或者如果你更喜欢它：

.posts   a:first-of-type img {
    margin-left:-80px;
    }
 .posts iframe {
margin-left:-20px;
    }

.</edit>

先猜答案无关紧要。你可以这样做：

.posts img:first-child {/* it will only select the first-child if it is an img tag */
margin-left:-20px;/* swallow that padding-left:20px; */
}

【讨论】：

Tumblr 在添加内容时有点奇怪，但这是我的全部代码：pastebin.com/6q4hFyZL
对于代码，我的意思是生成的 HTML 比您可以通过浏览器看到的（显示源代码），所以我们得到使用的结构和属性以及样式:)
@em202020 ，最好的，你有你页面的链接吗？

【解决方案2】：

能否为 .post img 添加 css 规则？

        .posts {
        border:solid 1px #333333;
        border-radius:15px 15px 15px 15px;
        color:black;
        margin-bottom:20px;
        min-height:120px;
        padding-left:20px;
        text-align:left;
    }


       #add this?#
       .posts img {
       padding:0px;

【讨论】：

它不会“杀死”.posts 上的填充
你也可以发布html吗？