https://demo.cssworld.cn/4/3-2.php

<style type="text/css">
.parent{
width:500px;
text-align: center;
overflow: hidden;
}
.son{
float: left;
width: 250px;
margin-bottom:-99999px;
padding-bottom: 99999px;
}
.son:nth-child(1){
background: #7FFFD4;
}
.son:nth-child(2){
background: #CD5C5C;
}
span{
display: block;
}
</style>
<body>

<div class="parent">
<div class="son">
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>
<span>1</span>

</div>
<div class="son">
<span>1</span>
<span>1</span>
<span>1</span>
</div>
</div>

</body>

CSS 左右两边底部对齐的更多相关文章

  1. [转]div内容底部对齐

    本文转自:http://blog.csdn.net/hellomy/article/details/5889833 <html> <head> <meta http-eq ...

  2. CSS布局之div交叉排布与底部对齐--flex实现

    最近在用wordpress写页面时,设计师给出了一种网页排布图样,之前从未遇到过,其在电脑上(分辨率大于768px)的效果图如下: 而在手机(分辨率小于等于768px)上要求这样排列: 我想到了两种方 ...

  3. CSS多种方式实现底部对齐

    CSS实现底部对齐效果 因公司业务要求需要实现如下图中红色区域的效果: 效果说明: 1.红色区域数据需要倒排(即从底部开始数,数字为1.2.3.4.5),并且显示在最底部 2.当数据过多时需要显示滚动 ...

  4. 【IOS】将字体大小不同的文字底部对齐

    从WP转IOS了,还是放不下...... 在项目中,要实现如图多个不同大小的文字   底部对齐的效果   像下面这样: (想要的效果) 以为用三个UIFont不同的UILabel  之后让他们底部对齐 ...

  5. 解决：并排的两个div底部对齐

    我希望在页面上画2个栈,并列起来,并且其内容是动态的,高度.宽度都可变,但是要保持底部对齐,如图: 实现的代码如下: <html> <head> <meta http-e ...

  6. CSS 布局 - 水平 & 垂直对齐

    CSS 布局 - 水平 & 垂直对齐 一.元素居中对齐 要水平居中对齐一个元素(如 <div>), 可以使用 margin: auto;. 设置到元素的宽度将防止它溢出到容器的边缘 ...

  7. CSS：CSS 布局 - 水平 & 垂直对齐

    ylbtech-CSS:CSS 布局 - 水平 & 垂直对齐 1.返回顶部 1. CSS 布局 - 水平 & 垂直对齐 水平 & 垂直居中对齐 元素居中对齐 要水平居中对齐一个 ...

  8. div+css页面右侧底部悬浮层

    效果体验:http://hovertree.com/texiao/css/23/ 效果图: 代码如下: <!DOCTYPE html> <html> <head> ...

  9. 如何让图片在垂直方向与 div的底部对齐 水平居中

    需要图片的绝对定位postion: absolute. 一般定位时, 是用div去定位. 一般不直接用 非div去"绝对/相对"定位. 如不直接用 等去定位. 因为这些好像不好定位 ...

随机推荐

  1. React生命周期详解

    React生命周期图解: 一.旧版图解: 二.新版图解: 从图中,我们可以清楚知道React的生命周期分为三个部分:  实例化.存在期和销毁时. 旧版生命周期如果要开启async rendering, ...

  2. Python openpyxl ： Excel 文档简单操作

    安装方法 使用 pip 或通过专门python IDE(如pyCharm)进行安装 其中pip安装方法,命令行输入:  pip install openpyxl 基本使用 第一步先是要导入 openp ...

  3. Mongo集群Java连接时UnknownHostException错误

    今天在 Java 连接 Mongo 集群时报了一个超时的错误,但是在本地客户端连接单节点的时候却能连上,具体报的错误如下: Caused by: com.mongodb.MongoTimeoutExc ...

  4. PHP——??空合并运算符和?:三元运算符

    前言 在上一篇随笔,用三元运算符简单写的一个东西,引发了对他的兴趣,所以打算研究下. PHP7的新特性: https://php.net/manual/zh/migration70.new-featu ...

  5. Linux系统 Cetos 7 中重置root密码

    几个月前在自己电脑上面安装了一个Linux 的虚拟机环境,当时是为了测试某一个小功能,用完就扔那里了,长时间没有使用,发现Root密码忘记了,登陆不了,怎么办呢?(ps:如果实际情况中忘记密码的这个服 ...

  6. P2447 [SDOI2010]外星千足虫 (高斯消元)

    题目 P2447 [SDOI2010]外星千足虫 解析 sol写到自闭,用文字描述描述了半个小时没描述出来,果然还是要好好学语文 用高斯消元求解异或方程组. 因为 \(奇数\bigoplus奇数=偶数 ...

  7. CF1153 F. Serval and Bonus Problem(dp)

    题意 一个长为 \(l\) 的线段,每次等概率选择线段上两个点,共选出 \(n\) 条线段,求至少被 \(k\) 条线段覆盖的长度期望. 数据范围 \(1 \le k \le n \le 2000, ...

  8. MySql自动备份shell

    MySql黑屏备份是每个运维工程师必备的技能,以下是MySQL自动备份脚本: #/bin/bash#This is mysql backup shell on 2019/4/28 BAKUP_DIR= ...

  9. 【集训队互测2015】Robot

    题目描述 http://uoj.ac/problem/88 题解 维护两颗线段树,维护最大值和最小值,因为每次只有单点查询,所以可以直接在区间插入线段就可以了. 注意卡常,不要写STL,用链表把同类修 ...

  10. 【WebSocket】WebSocket介绍

    1.背景 在WebSocket出现之前客户端向服务器发出请求是通过http协议实现的,而http协议有个特点是通行请求只能由客户端发起,然后服务端响应查询结果,HTTP 协议没法让服务器主动向客户端推 ...