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

问题描述

我想在我的div的右下角对齐我的按钮。

div的当前css：

  float：right; 
 width：83％; 
 margin-right：0px; 
 font-family：Arial，Helvetica，sans-serif; 
 font-size：12px; 
 height：625px; 
 overflow：auto; 
  
 
 
解决方案
绝对; 绝对定位一个元素在父div。 
当使用 position：absolute; 时，元素将绝对位于第一个定位的父div，如果它找不到一个，它将绝对位于窗口
 
 
 
要使内容div定位，所有 position 不是静态的值将起作用，但 relative 是最简单的，因为它不会改变div本身的定位。
 
 
 
因此，向内容div添加 position：relative; ，从按钮中删除float，并将以下css添加到按钮：
  position：absolute; 
 right：0; 
 bottom：0 
  
 
I want to align my button at the bottom right corner of my div. How can I do that?



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

解决方案
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.

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.

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屋！