2

另一个 CSS 问题。

我在标签内有 div 框<li>,在标签内<ul>。每个 div 标签都包含一张图片,图片下方有文字。图像的大小都相同,但文本的长度不一样 - 所以 div 框的大小也不一样。我希望图像的顶部对齐,但现在它们看起来更像楼梯。我尝试改变 div 的高度,但这会将盒子向下延伸,而不是向上延伸。这是我到目前为止的相应代码。

<ul>
        <li class="line2"><div style="width:284px;border:3px;border-style:solid;"><img class="border" src="/images/icons/1.png" width="284" height="164" alt=""/><p>Paragraph.</p></div></li>
        <li class="line2"><div style="width:284px;border:3px;border-style:solid;"><img class="border" src="/images/icons/2.png" width="284" height="164" alt=""/><p>Longer Paragraph</p></div></li>
        <li class="line2"><div style="width:284px;border:3px;border-style:solid;"><img class="border" src="/images/icons/3.png" width="284" height="164" alt=""/><p>Longest Paragraph</p></div></li>
        </ul>

(边界只是让我可以看到我正在使用的东西)

我意识到我可以将图像和文本分成不同的 div,但是我已经有很多不同的 div,我觉得我有点过分了。如果这是最好的方法,我会的,但我想确定。

如果有人可以提供帮助,我将不胜感激。谢谢。

4

2 回答 2

0

除了最明显的东西,我什么都试过了;我<br/>在文本下添加了低于最高标签的标签。我知道可能有更好的方法来做到这一点,但最简单的方法对我有用。

于 2013-02-16T21:05:18.633 回答
0

标签基本上添加了一个<div>带有换行符的逻辑划分。这就是为什么它像楼梯一样显示。所以我建议,你应该尝试<span>使用标签,通过它你可以水平对齐你的盒子;我希望这有帮助

于 2013-02-16T08:35:59.120 回答