Html 将图像与文本块对齐

永不再丢失电子邮件
第二段要求缩进

这是我的解决方案

我将图像的

位置

设置为

绝对

，并将

左填充

添加到容器中，使其大于图像的宽度。 这将确保添加的文本具有适当的缩进

这也会导致更干净的html结构，并防止嵌套

div

s

.custom类{
位置：相对位置；
填充物：5px；
左侧填充：50px；
}
.定制p类{
文本对齐：左对齐；
保证金：0；
}
.定制类img{
位置：绝对位置；
顶部：4px；
左：4px；
}

永远不要再丢失电子邮件
第二段要求缩进

您应该能够使用

valign wrapper

类将img和段落包装在div中

<div class="center-align”>
    <div class="valign-wrapper">
        <img src="https://placehold.it/28x28" />
        <p style="">Never lose an email again</p>
    </div>
    <p style="font-size: 0.8em; margin-left: 28px;">Second paragrah the wants to have indentation</p>
</div>

---

我建议您使用图标或类似的东西，而不是使用图像来实现最终结果

更新后的代码段将复制附加的屏幕截图-


.small{
字号：0.8em；
边缘顶部：20px；
}
.盒子{
宽度：30%；
左边缘：35%；
保证金权利：35%；
边缘顶部：30px；
}
.盒子：以前{
字体系列：Fontsome；
颜色：绿色；
字体大小：25px；
位置：绝对位置；
左边距：-33px；
页边顶部：-5px；
}
.放大：之前{
内容：“\f002”；
}
.书：以前{
内容：“\f02d”；
}

永远不要再丢失电子邮件

第二段想要缩进第二段想要缩进第二段想要缩进第二段想要缩进第二段想要缩进

永远不要再丢失电子邮件

第二段想要缩进第二段想要缩进第二段想要缩进第二段想要缩进第二段想要缩进

能否将您的代码添加到代码段？是否要在子文本（标题下）中设置填充