对齐此处看到的框的最佳方法是什么:
http://property.begbies-traynor.com
有问题的框是“更多详细信息”框。无论描述长度如何,我都希望它们都能在页面上完美排列。
最好使用 CSS 吗?JS?还是硬编码的php?
该网站基于 wordpress,使用自定义主题。
对齐此处看到的框的最佳方法是什么:
http://property.begbies-traynor.com
有问题的框是“更多详细信息”框。无论描述长度如何,我都希望它们都能在页面上完美排列。
最好使用 CSS 吗?JS?还是硬编码的php?
该网站基于 wordpress,使用自定义主题。
设置每个容器,例如:
<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/
我会为此选择 CSSmin-height
属性<p>
并将其设置为100-200
. 这将使特别长的文本提高框,但通常你会有很好的对齐按钮。
不要用 隐藏文本overflow
。它很丑。
CSS 将是我最好的选择。您可以为隐藏溢出的描述框设置一个固定高度(以便隐藏任何额外的描述文本),并且在描述框的正下方有另一个 div 来保存“更多详细信息”框。这样,所有“更多详细信息”框都将位于一条直线上。
给描述容器一个类并在css中为其设置一个高度