对于div的居中 ,如果是有固定宽高的,可以加margin:auto;水平垂直居中,但如果是不固定宽高,又想让div居中的话,这种方式都可能不奏效,达不到想要的效果。

有两种方法:1、加display:inline;变成内联元素,可以给父级加text-align:center

2.

.inwrap {
float: left;
position: relative;
left: 50%;
}
.page {
float: left;
position: relative;
left: -50%;
}
<div class="wrap clearfix">
<div class="inwrap">
<div class="page">
这是内容
</div>
</div>
</div>

不固定宽度的div居中显示的更多相关文章

  1. 设置div中的div居中显示

    设置div中的div居中显示 方法一. <div class='big'> <div class='small'>box1</div> </div> s ...

  2. DIV居中显示

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 让几个横向排列的浮动子div居中显示的方法

    div设置成float之后,就无法使子div居中显示了,那么如何让几个横向排列的浮动的div居中显示呢,下面有个不错的方法,希望对大家有所帮助 div设置成float之后,在父div中设置text-a ...

  4. 多个div居中显示

    页面中有多个div时我们希望并排居中显示,可以通过在并排显示的div上一层再加一个div,设定宽度,然后让其居中显示达到需要的效果. 关键是要对外层div设定宽度. <!DOCTYPE html ...

  5. css div居中显示的4种写法

    Demo:http://www.feman.cn/h5/center.html .absolute 绝对定位 这是我们最常用的一种居中定位写法 要求必须确定div的宽高度 目前市面上的浏览器基本上都支 ...

  6. div 居中显示

    <html lang="en"> <head> <meta charset="UTF-8"> <title>di ...

  7. 【HTML】div居中显示

    方法1: .parent { width:800px; height:500px; border:2px solid #000; position:relative; } .child { width ...

  8. 使用inline-block,使前面img,后面空div居中显示在一行后,导致当div中有内容时,div下移问题

    .pro_li img,.pro_sm{display: inline-block; *display:inline;*zoom:1;vertical-align: middle ;} 解决方法:使用 ...

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

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

随机推荐

  1. C# 视频监控系列:学习地址汇总

    原文地址:http://www.cnblogs.com/over140/archive/2009/04/07/1429308.html 前言 对于视频监控系统大家应该是不陌生的,实施的路况信息.地铁. ...

  2. Asp.Net MVC项目通过Git同步到新开发设备上后无法作为网站启动

    右键项目名->属性->启动项目->单启动项目,在下拉框中选择你的网站主项目就可以了.(由于用的英文版,所以翻译的内容可能略有差异)

  3. js闭包避免内存泄漏 减少内存使用 避免对象无法回收注意事项

    闭包 如果闭包的作用域中保存着一个 HTML 元素,则该元素无法被销毁.(下面代码来自高程) 闭包是 JavaScript 开发的一个关键方面:匿名函数可以访问父级作用域的变量. function a ...

  4. OZ Report 오즈 리포트 개발

    //这只单元格数据颜色 if( (int)getattr("caption") > 100) setattr("bgcolor", "$0,0, ...

  5. Java并发编程(五):Java线程安全性中的对象发布和逸出

    发布(Publish)和逸出(Escape)这两个概念倒是第一次听说,不过它在实际当中却十分常见,这和Java并发编程的线程安全性就很大的关系. 什么是发布?简单来说就是提供一个对象的引用给作用域之外 ...

  6. android 建数据库 SQLite 存储sd 卡或者内存

    android 创建数据库调用SQLiteOpenHelper,一般不直接操作SQLiteDatabase . 是通过SQLiteOpenHelper来获取 public class DBOpenHe ...

  7. [na]台式机装原版Win2008R2

    坑了老半天,总结出几点 1,系统os下载: http://msdn.itellyou.cn/ 注:其他地方下载的,装后发现不是起不来就是驱动装不了. 2,u盘里放个压缩软件: 好呀压缩   和  浏览 ...

  8. 反射学习1、反射机制的介绍和基本的API的使用

    关于动态语言: 一般而言,开发者社群说到动态语言,大致认同的一个定义是:“程序运行时,允许改变程序结构或变量类型,这种语言称为动态语言”.从这个观点看,Perl,Python,Ruby是动态语言,C+ ...

  9. 前端点击删除按钮删除table表格的数据

    table.on('tool(hostTable)', function (obj) { var data = obj.data;//须写 if (obj.event === 'del') { var ...

  10. 浅谈配置文件:spring-servlet.xml(spring-mvc.xml) 与 applicationContext.xml

    在搭建 spring mvc 的框架时,会有2个配置文件必不可少: spring-servlet.xml 和applicationContext.xml.第一次接触spring mvc的工程师可能会对 ...