Found another solution:

Just add

position: relative;

top: 50%;

transform: translateY(-50%);

to the inner div.

Codepen: http://codepen.io/anon/pen/ZYprdb

div 居中的更多相关文章

  1. bootstrap之div居中

    bootstrap之div居中 偏移列 偏移是一个用于更专业的布局的有用功能.它们可用来给列腾出更多的空间.例如,.col-xs=* 类不支持偏移,但是它们可以简单地通过使用一个空的单元格来实现该效果 ...

  2. 移动页面div居中效果代码

    在线查看效果:http://hovertree.com/texiao/mobile/4.htm 可用手机浏览器查看 以下为HTML文件: <!DOCTYPE html> <html& ...

  3. 【转】div居中代码 DIV水平居中显示CSS代码

    原文地址:http://www.divcss5.com/rumen/r622.shtml 如何使用CSS让DIV居中显示,让div水平居中有哪些CSS样式呢? 需要的主要css代码有两个,一个为tex ...

  4. 【转】CSS中怎么让DIV居中

    来源:http://www.cnblogs.com/DebugLZQ/archive/2011/08/09/2132381.html     CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的 ...

  5. 关于div居中

    margin : 100px; margin-left: auto; margin-right: auto; 这样子设置css样式就可以实现一个div居中

  6. CSS实现div居中

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. HTML4如何让一个DIV居中对齐？float输入日志标题

    float:left,right clear:both 如何让一个DIV居中对齐? 第一步:设置外层的DIV的text-align:center; 第二步:设置里层的DIV的margin:auto 以 ...

  8. CSS中怎么让DIV居中(转载)

    CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性, 网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题. 可 ...

  9. CSS中怎么让DIV居中

    CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性, 网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题. 可 ...

  10. DIV居中的经典方法

    1. 实现DIV水平居中 设置DIV的宽高,使用margin设置边距0 auto,CSS自动算出左右边距,使得DIV居中. 1 div{ 2 width: 100px; 3 height: 100px ...

随机推荐

  1. SQL SERVER CURSOR游标的使用(转载)

    一:认识游标 游标(Cursor)它使用户可逐行访问由SQL Server返回的结果集. 使用游标(cursor)的一个主要的原因就是把集合操作转换成单个记录处理方式. 用SQL语言从数据库中检索数据 ...

  2. w3school一个学习编程的好地方！

    http://www.w3school.com.cn/index.html 每天过来学习几篇.

  3. Android Studio 查看密钥库证书指纹SHA1

    打开DOC命令窗体

  4. DIY FSK RFID Reader

    This page describes the construction of an RFID reader using only an Arduino (Nano 3.0 was tested, b ...

  5. Python 字符串关键字过滤

    问题:把给定字符串中的关键字用与关键字等长的“*”串代替. Solution: 方法1: string 中的 replace 函数 方法2: def censor(text, word): words ...

  6. ACE - Reactor源码总结整理

    ACE源码约10万行,是c++中非常大的一个网络编程代码库,包含了网络编程的边边角角. ACE代码可以分三个层次:OS层.OO层和框架层: OS层主要是为了兼容各个平台,将网络底层API统一化,这一层 ...

  7. 传智播客JavaWeb day06-jstl

    一.jsp标签(sun公司提供的) 二.EL表达式 三.jstl (javaserver pages standard tag library) 1.为什么要有jstl jsp标签太弱,el表达式功能 ...

  8. B - 搬寝室

    Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit Status Pract ...

  9. MySql数据库主主同步配置步骤

    测试环境:  192.168.1.192  192.168.1.193    mysql5.2     配置192服务器:  /usr/local/mysql/bin/mysql -uroot -p ...

  10. HSDB

    select t from java.lang.Thread t $JAVA_HOME/bin/java -classpath $JAVA_HOME/lib/sa-jdi.jar sun.jvm.ho ...