如何让一个div里面的div垂直居中?

如何让上面灰色有文字那个div和背景图标垂直居中,不管屏幕大小有好大,始终在垂直方向上的中间。上面有整个布局和样式表,谢谢高手指点

CSS3时代当然要用CSS3的完美解决办法。不能忍受以前的height和line-height同高等等的解决方法,想想都觉得不优雅。

用CSS3中的flexbox 布局模式:

.vertical-container{
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
}

CSS里总算是有了一种简单的垂直居中布局的方法了!

如何让一个div里面的div垂直居中?的更多相关文章

  1. 后台找到repeater里面的div并添加客户端点击事件

    public partial class Inv_SelectWorkservice : System.Web.UI.Page,IPostBackEventHandler{ } 通过OnItemCre ...

  2. 里面的div怎么撑开外面的div,让高度自适应

    关于容器高度自适应的兼容性问题.1.有些时候,我们希望容器有一个固定高度,但当其中的内容多的时候,又希望高度能够自适应,也即容器在纵向能被撑开,且如果有背景,也能够自适应.在一般情况下,使用min-h ...

  3. 里面的div怎么撑开外面的div让高度自适应

    参考网址:http://www.jb51.net/css/140685.html 随着微软新操作系统的上市,ie6现在用的人越来越少了,但是XP系统看来是太过经典,仍然有相当多的用户在使用,且这部分人 ...

  4. 实现div里的内容垂直居中

    ---恢复内容开始--- 在项目中我们会遇到这种情况,一个div的宽固定,里面的内容长度不定,不管是一行还是多行,都要垂直居中,有俩个实现方法: 1.使用absolute,top:50%,transf ...

  5. Activity往另外一个Activity传值,Fragment获取另外一个Activity里面的值。

    在oneActivity中实现跳转到MainActivity //intent 用来跳转另外一个MainActivity,bundle传值到MainActivity         Intent Ma ...

  6. 一个大div里面包裹一个小div,里面的小div的点击事件不触发外面的这个大div的点击事件

    一开始上html代码 <div id="div1" style="background: blue;width: 100px; height: 100px;&quo ...

  7. Div中嵌套一个div,怎么是里面的div居中?

    盒子居中是在写样式中经常遇到的问题,在这里说个我经常使用的方法~ 利用绝对定位:

  8. div里面的margin-top失效

    div标签中的元素margin-top失效的解决方法 元素上级标签是div,已经设置了width和height等的属性,可是,在对元素使用margin进行调整的时候,无法生效,下面有个不错的解决方法, ...

  9. 出发a链接里面的div,a链接不进行跳转

    HTML <a href="http://www.baidu.com" style="display: inline-block; width: 100%; hei ...

随机推荐

  1. PLU Decomposition

    PLU分解的优点是,能够将Ax=b的矩阵,转换成Ly=b, Ux = y 的形式.当我们改变系数矩阵b时,此时因为矩阵L和U均是固定 的,所以总能高效的求出矩阵的解. // LU.cpp : Defi ...

  2. Java后端发出post请求带参数并接收返回的json

    核心代码: 参数格式: “key1=value1&key2=value2” /*** sendUrl    (远程请求的URL)* param    (远程请求参数)* JSONObject  ...

  3. Spring中定时器实现

    在Spring 中使用Quartz,本文介绍Spring3.0以后自主开发的定时任务工具,spring task,可以将它比作一个轻量级的Quartz,而且使用起来很简单,除spring相关的包外不需 ...

  4. ios27--kvo

    // // ViewController.h // 14-KVO的使用 #import <UIKit/UIKit.h> @interface ViewController : UIView ...

  5. android 6.0编译时出现ERROR:Security problem ,see jack server log【转】

    本文转载自:http://blog.csdn.net/a567890k/article/details/52956798 最近编译Android6.0时经常出现以下错误 临时解决方法: Buildin ...

  6. bzoj2709: [Violet 1]迷宫花园

    二分答案,spfa check就行了. gb题卡精度. #include<cstdio> #include<iostream> #include<cstring> ...

  7. codeforces 245H Queries for Number of Palindromes RK Hash + dp

    H. Queries for Number of Palindromes time limit per test 5 seconds memory limit per test 256 megabyt ...

  8. 第六周 Leetcode 446. Arithmetic Slices II - Subsequence (HARD)

    Leetcode443 题意:给一个长度1000内的整数数列,求有多少个等差的子数列. 如 [2,4,6,8,10]有7个等差子数列. 想了一个O(n^2logn)的DP算法 DP[i][j]为 对于 ...

  9. 正则表达式:(?=a)是什么意思?

    1.(?=a) 表示我们需要匹配某样东西的前面. 2.(?!a) 表示我们需要不匹配某样东西. 3.(?:a) 表示我们需要匹配某样东西本身. 4.(?<=a) 表示我们需要匹配某样东西的后面. ...

  10. 词典(一) 跳转表(Skip table)

    词典,顾名思义,就是通过关键码来查询的结构.二叉搜索树也可以作为词典,不过各种BST,如AVL树.B-树.红黑树.伸展树,结构和操作比较复杂,而且理论上插入和删除都需要O(logn)的复杂度. 在词典 ...