在CSS、Mosaic jQuery中正确对齐文本

好的，所以我正在使用（一个用于悬停文本的jQuery插件，等等），不管怎样，我已经开始工作了，但现在我的问题是文本与我正在尝试的内容正确对齐。我试图让“销售商品”这几个字以很少的空间出现在彼此的顶部。但是，如果我使用换行符“br/”，它会在两行之间留下一个很大的间隙。我已尝试将display属性设置为block。将两个“p”元素设置为“顶部”和“底部”，并以这种方式对齐。我只是想找一个非常精通CSS的人来帮忙

基本上我是想让文本正确对齐

HTML：

<div class="mosaic-block demo" id="sale">
    <div class="mosaic-overlay">
        <h1 class="mosaic">sale items</h1><br/>
        <p><strong>get them before they're gone!</strong></p>
    </div>
    <div class="mosaic-backdrop"><img src="img/sale.png" /></div>
</div>

---

jQuery方面工作得很好，它完成了它的工作。但是我的CSS是缺乏的。

您可能正在寻找CSS属性

行高

，我在您的CSS中没有看到它的定义，所以这应该很容易。首先，将两个单词强制放在不同的行上：

<div class="mosaic-block demo" id="sale">
    <div class="mosaic-overlay">
        <h1 class="mosaic">sale<br/> items</h1><br/>
        <p><strong>get them before they're gone!</strong></p>
    </div>
    <div class="mosaic-backdrop"><img src="img/sale.png" /></div>
</div>

---

如果文本被框剪裁，您可以根据需要在顶部/底部添加填充以获得所需的外观。

您可能正在查找CSS属性

行高，我在CSS中没有看到该属性的定义，因此这应该很容易。首先，将两个单词强制放在不同的行上：

<div class="mosaic-block demo" id="sale">
    <div class="mosaic-overlay">
        <h1 class="mosaic">sale<br/> items</h1><br/>
        <p><strong>get them before they're gone!</strong></p>
    </div>
    <div class="mosaic-backdrop"><img src="img/sale.png" /></div>
</div>

如果文本被框剪切，如果需要，可以在顶部/底部添加填充，以获得所需的外观。
我想我刚刚解决了您的问题，但如果没有，请对所有代码进行修改，重现您的问题。这包括插件javascript和你写的东西，因为它们都是相关的。我想我刚刚解决了你的问题，但如果不是，请用你所有的代码做一个测试，重现你的问题。这包括插件javascript和您编写的内容，因为它们都是相关的。非常简单。哼！非常感谢，很简单。哼！谢谢。
h1.mosaic {
    display: inline;
    line-height: 50px;
    font-family: "ONRAMP";
    margin: 0;
    padding-left: 90px;
    padding-top: 0;
    font-size: 60px;
    text-transform: capitalize;
    width: 110px;
}