HTML 跟随行缩进对齐答案

【问题标题】：HTML follow on line indent alignmentHTML 跟随行缩进对齐
【发布时间】：2018-03-16 00:52:34
【问题描述】：

我正在将内容添加到我无法修改但允许任何 HTML 的预定义布局。我希望像浮动文本框一样对齐一段文本，但由于我无法更改的 h4 和 p 类，这很困难。

我想看的是：

但目前看起来像：

生成的 HTML 当前为：

<div class="element property-line"><h4 class="property-name">Foo</h4>
<p class="p property-text">
    BAR <div style="line-height: 90%;";>
    <i> quite a long but of text that needs to wrap</i></div>
<p></p></div>

...我的内容从 BAR 开始并以 i 和 div 结束标记结束。

我想我可能错过了格式化技巧。

【问题讨论】：

你为什么用这个<div style="line-height: 90%;";>？
有很多文本需要放入一个小空间，@hamza。我无法进一步减小字体大小，但我可以通过稍微减小行高来压缩它。
我试图编辑我的问题以避免更多的反对票，但了解为什么它已经有两个投票会很有帮助。

标签： html text-alignment

【解决方案1】：

<div class="element property-line">
    <h4 class="property-name">Foo</h4>
    <p class="p property-text">
        BAR 
        <span style="line-height: 90%;">
             <i> quite a long but of text that needs to wrap</i>
        </span>
    </p>
</div>

这应该是你所追求的，<span> 标签适合更改/样式化段落中的文本，因为<div> 标签更适用于结构元素。

您的原始代码在最后一行还有一个额外的开头<p>。

【讨论】：

span 确实保留了行高并继续第一行的文本@EbeenAndGone。我只需要以某种方式正确证明跨越的文本。额外的 <p> 是 Javascript 构造的一部分，所以我无法删除它。
尝试：<span style-"line-height: 90%; text-align:justify;"> 另见：w3schools.com/cssref/css3_pr_text-justify.asp
谢谢，@EbeenAndGone，但我找到了解决我遇到的问题的方法，我正在考虑删除这个问题以避免 -2 代表。
这非常违背stackoverflow的精神。其他人可能会发现此线程很有用。无论您是否找到原始问题的解决方案，都不要删除该问题。如果您最终解释您的解决方案是什么，这可能对其他人有所帮助。

【解决方案2】：

我使用 MS Word 创建了一个我希望它出现的文档，然后排除了它放入的所有无关紧要的东西；留给我：

<p style="margin-left:50pt; text-indent:-50pt">

然后找到了一种解决方法来模仿 <h4 class= 和 <p class= 部分，以便它们都适合一个 <div>。

【讨论】：