使用 CSS 对齐 div 底部的按钮 [英] Align button at the bottom of div using CSS

查看:57
本文介绍了使用 CSS 对齐 div 底部的按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想在我的 div 的右下角对齐我的按钮.我该怎么做?

I want to align my button at the bottom right corner of my div. How can I do that?

div 的当前 css:

Current css of div:

    float: right;
    width: 83%;
    margin-right: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    height:625px;
    overflow:auto;

推荐答案

您可以使用 position:absolute; 在父 div 中绝对定位元素.使用 position:absolute; 时,元素将从第一个定位的父 div 绝对定位,如果找不到,它将从窗口绝对定位,因此您需要确保内容 div已定位.

You can use position:absolute; to absolutely position an element within a parent div. When using position:absolute; the element will be positioned absolutely from the first positioned parent div, if it can't find one it will position absolutely from the window so you will need to make sure the content div is positioned.

为了使内容 div 被定位,所有非静态的 position 值都将起作用,但 relative 是最简单的,因为它不会改变 div 的定位自己.

To make the content div positioned, all position values that aren't static will work, but relative is the easiest since it doesn't change the divs positioning by itself.

所以在内容div中添加position:relative;,去掉按钮的浮动,然后在按钮中添加如下css:

So add position:relative; to the content div, remove the float from the button and add the following css to the button:

position: absolute;
right:    0;
bottom:   0;

这篇关于使用 CSS 对齐 div 底部的按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆