CSS有没有办法在同一个类中设置图像和文本之间的间距？答案

【问题标题】：CSS is there a way to set spacing between an image and text within the same class?CSS有没有办法在同一个类中设置图像和文本之间的间距？
【发布时间】：2013-06-07 17:58:06
【问题描述】：

我正在尝试在 css 中设置一个类来显示图像和图像之后的字符串。问题是图像和文本重叠。有没有办法在同一类中放置图像和文本之间的间距？这是我的代码：

.innerTitle {
display: inline;
background-image: url(../images/tsegs_squigs.jpg);
background-repeat: no-repeat;
background-position: left center;
font-size: 16px;
font-weight: bold;
text-transform: uppercase;
margin: 0px;
padding: 0px;
width: 100%;
}

【问题讨论】：

一点html代码？内联元素的宽度没有影响。
我试图避免修改除此类之外的任何内容。如果我必须创建另一个类，或者插入任何 html 代码，这将需要更多的工作，因为我必须更新 20 个不同的 php 文件。
这样的事情不应该使用内联元素来完成，即使有实现你想要的技巧，最好更新所有这 20 个页面。
我要的是一个 rel life html 与那个类，图像大小。填充将设置所需的任何空间

标签： css image text position

【解决方案1】：

将此添加到 css 类：

{text-indent:50px;} Or
{text-indent:<width of background image>px;}

【讨论】：

谢谢阿尼。那行得通。另外值得注意的是，我必须删除 {display: inline;}
如果您的字符串包含多行，文本缩进可能不起作用，因为只有第一行会有间距。
填充效率更高

【解决方案2】：

您需要为元素添加内边距，因为内边距会增加背景将显示的元素的大小。填充仅适用于块和内联块元素。

.innerTitle {
    display: inline-block;
    padding-left: <width of background image>px
}

【讨论】：