在页面上对齐这些元素的最佳方法是什么？

Question

对齐这里看到的方框的最佳方法是什么：

http://property.begbies-traynor.com

有问题的方框是“进一步详细信息”框。无论描述长度如何，我希望他们都能在页面上完美排列。

最好使用CSS吗？ JS？还是硬编码的php？

该网站使用自定义主题基于wordpress。

Answer 1

设置每个容器，例如：

<div class="post-3283 sale type-sale status-publish hentry ts-box box-4 clear">

要有一个额外的类，并在其中设置：

height:370px; position:relative;

然后，给每个持有绿色按钮的<p>一个类，然后给出规则：

position:absolute; bottom:0;

您可以通过将ts-box设置为具有这些添加的规则，并为后面的定位规则提供单个p来对此进行测试。

编辑：这是一个说明这个概念的小提琴。忽略float，width和border属性，它们仅用于概念化：http://jsfiddle.net/aTtAW/

Answer 2

CSS是我最好的选择。对于描述框，您可以使用固定高度隐藏溢出（以便隐藏任何额外的描述文本），并且在描述框的正下方有另一个div来保存“更多详细信息”框。这样，所有“进一步细节”框都将成直线。

Answer 3

给描述容器一个类，并在css中设置一个高度

Answer 4

我会为min-height选择CSS <p>属性并将其设置为100-200。这将使特别长的文本增加框，但通常你会有很好的对齐按钮。

请勿使用overflow隐藏文字。这太丑了。