<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <title>JS Bin</title>

</head>

<body>

  <div class="div1">

      <div class="div2"></div>

  </div>

</body>

</html>
.div1{

  border:solid 1px red;

  width:100%;

  height:400px;

  position:relative;

  margin-top:80px;

}

.div2{

  border:solid 1px red;

  width:100%;

  height:60px;

  position:absolute;

  margin:auto;

  bottom:; right:;

  box-sizing: border-box;

  border-left:none;

  border-right:none;

  border-bottom:none;

}

http://jsbin.com/miciburuwo/1/

css position:absolute align center bottom的更多相关文章

  1. CSS position:absolute浅析

    一.绝对定位的特征 绝对定位有着与浮动一样的特性,即包裹性和破坏性. 就破坏性而言,浮动仅仅破坏了元素的高度,保留了元素的宽度:而绝对定位的元素高度和宽度都没有了. 请看下面代码: <!DOCT ...

  2. css position: absolute、relative详解

    CSS2.0 HandBook上的解释: 设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的位置 ...

  3. css position absolute相对于父元素的设置方式

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 大家知道css的position abs ...

  4. css position:absolute 如何居中对齐

    写死宽度,就好弄了 position: absolute;left: 50%;width: 980px;margin-left: -490px; text-algin:center

  5. CSS position: absolute、relative定位问题详解

    CSS2.0 HandBook上的解释:  设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位,而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的 ...

  6. css position absolute 浮动特性

    absolute的元素不会占据未浮动的元素的空间<html> <head> <style type="text/css"> .flipbox{ ...

  7. CSS position绝对定位absolute relative

    常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:absolute和position:relative实现. 一.position语法与结 ...

  8. CSS position属性absolute relative等五个值的解释

    DIV CSS position绝对定位absolute relative教程篇 常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:abs ...

  9. css之absolute

    一.absolute和float有相同的特性,包裹性和破坏性 1.absolute和float的相似(看下面的demo,如果图片在左上角,那么用float和absolute都一样) <!doct ...

随机推荐

  1. .net framework profiles /.net framework 配置

    几年前一篇关于 .net framework client profile http://www.cnblogs.com/zzj8704/archive/2010/05/19/1739130.html ...

  2. 041队列queue(重要,多线程使用)

    内容:队列类型.方法.使用 ###############queue定义了3种信息列队模式类Queue([maxsize]):FIFO列队模式LifoQueue([maxsize]):LIFO列队模式 ...

  3. flume MemoryChannel 源代码解析

    1.先分析三个LinkedBlockingDeque<Event>类型的takeList,putList,queue putList:  存放的是来自source生产的数据,通过调用doP ...

  4. collecitons.deque

    python队列,可以使用collections里面的deque,将列表当作队列使用. deque方法有: from collections import deque deque.append() d ...

  5. 随手练——O(n)解决无序数组排序后的相邻最大差值

    题目从这儿看到的 : https://mp.weixin.qq.com/s/2OXg67MfBuQjDPAJxxD8rQ,但是公众号上讲错了,问题还挺严重的. 题目知识点:桶排序. 题目:有一个无序数 ...

  6. momenta

    编程:1.dp的题 2.白纸写代码,给一串数和一个目标值,使用四则运算和括号使得这串数最后计算结果为目标值,打印出所有的方案,要求是这些数每个最多被使用一次,可以不被用到. 3.考了一个查找数组里,未 ...

  7. sql连接查询INNER JOIN，LEFT JOIN，RIGHT JOIN区别

    测试表 课程表cource 教师表teacher 查询老师教的课程 1.inner join内链接 ,只显示完全匹配的查询结果 SELECT  cource.cname,teacher.tname f ...

  8. rabbitmq关于guest用户登录失败解决方法

    刚安装完rabbitmq,登录的时候出现了: login  failed问题: 查看rabbitmq的文档,发现在3.3.1以后的版中,处于安全的考虑,guest这个默认的用户只能通过localhos ...

  9. CSS3 - 新单位vw、vh、vmin、vmax使用详解（附样例）

    像 px.em 这样的长度单位大家肯定都很熟悉,前者为绝对单位,后者为相对单位.CSS3 又引入了新单位:vw.vh.vmin.vmax.下面对它们做个详细介绍. 一.基本说明 1,vw.vh.vmi ...

  10. [LuoguP2158][SDOI2008]仪仗队

    [LuoguP2158][SDOI2008]仪仗队(Link) 现在你有一个\(N \times N\)的矩阵,求你站在\((1,1)\)点能看到的点的总数. 很简洁的题面. 这道题看起来很难,但是稍 ...