小编Joe*_*men的帖子

使用CSS在div中定位锚标记

在Wordpress中,我试图仅使用CSS来改变给定主题的一些标准布局.以下标记生成一个div,其中所有子元素从顶部流出(如预期的那样).

问题是我有3个divs并排,并希望按钮(anchor格式化为按钮)始终位于每个对应的底部,div 无论锚点/按钮("我们的团队")前面有多少行文本. ..更多文本"在下面的例子中,但更多的文本为其他2个div).在div具有300像素的固定高度.我希望能够只用CSS做到这一点.我已经看到一些解决方案将锚点包含在跨度或div中,但我真的不鼓励自己编辑主题代码.有没有办法让锚点位于div的底部而不管文本的数量是多少?

编辑:这div只是此给定页面上内容的一小部分.它不是唯一的标记.

<div class="widget-front">
    <h2>The Team</h2>
    <p class="fp-text-one">Our team ...more text</p>
    <a class="btn btn-primary fp-button" href="http://www.mysite.com/the-team/" title="The Team">Read more ...</a>
</div>
Run Code Online (Sandbox Code Playgroud)

我有一个选择器:

.widget-front > a {
    XXX
}
Run Code Online (Sandbox Code Playgroud)

它确实正确识别按钮,但我似乎无法让锚/按钮位于div的底部..

对于XXX我试过(并失败)

  1. position: absolute;
    bottom:0

  2. position: relative

  3. position: relative
    bottom:0

  4. vertical-align: bottom

html css wordpress

2
推荐指数
1
解决办法
6710
查看次数

标签 统计

css ×1

html ×1

wordpress ×1