多个div在某个div的中间,他们个数不一定但是需要在那个父级div中显示(和margin:0 auto一样的效果)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">

.div_allinline
{
text-align:center;
margin:0 auto;
padding:0;
clear:both;
}

.subdiv_allinline
{
margin:0;
padding:0;
display:inline-block;
_display:inline;
*display:inline;
zoom:1;
}
</style>

</head>

怎么居中显示在一行呢?使用inline-block来做这个处理。

<body>
<div class="div_allinline">
<div class="subdiv_allinline">
你好,这是div1的第一行。
<br>你好,这是div1的第二行
</div>
<div class="subdiv_allinline">
你好,这是div2的第一行。
</div>
<div class="subdiv_allinline">
你好,这是div3的第一行。
<br>你好,这是div3的第二行
</div>
</div>
</body>
</html>

IE6,IE7中不支持inline-block,所以针对IE6,IE7写了下面的三个属性。

_display:inline;
    *display:inline;
    zoom:1;

这样貌似就主流的浏览器里面都能够正常显示。div的宽度可以根据情况设置。

多个div同时居中的写法的更多相关文章

  1. 用CSS让DIV上下左右居中的方法

    转载自喜欢JS的无名小站 例如 一个父div(w:100%;h:400px)中有一个子div(w:100px;100px;).让其上下左右居中. 方法一(varticle-align) 理念 利用表格 ...

  2. 左边图标右边文字,在div里居中

  3. 绝对定位的DIV绝对居中显示

    绝对居中:即在客户端上任何分辨率下纵横方向均居中 紫色的正方形为绝对定位的div position:absolute; top: 50%; left: 50%; 只能把div定位在以红色圈为起点的位置 ...

  4. HTML5:footer定位(底部+居中)的探讨+div图片居中问题

    初学HTML+CSS布局,尝试自己写一个百度首页,可是footer的定位遇到麻烦而且百度没有好的解决方法,在此记录下逐步的过程.记录之,备忘. 初学,解决方法难免出现不妥之处,也请看到这篇文章的前辈指 ...

  5. div居中与div内容居中,不一样

    1.div自身居中 使用margin:0 auto上下为0,左右自适应的css样式. 要让div水平居中,那么除了设置css margin:0 auto外,还不能再设置float,不然将会导致div靠 ...

  6. css 如何使图片与文字在div中居中展示?

      1.情景展示 如何将图片与文字在div中一起居中展示? HTML片段 <div style="background: #fff;padding-top: 5px;border:1p ...

  7. jQuery实现的浮动层div浏览器居中显示效果

    本文实例讲述了jQuery实现的浮动层div浏览器居中显示效果.分享给大家供大家参考,具体如下: 1.在页面的head中引入jQuery <script type="text/java ...

  8. 层居中绝对定位的div的居中方法,下面的写法兼容IE系列浏览器和火狐浏览器

    详细解说,直接看样式:#dingwei{padding:10px;background-color:#003300;color:#FFFFFF; width:600px;height:300px; d ...

  9. 绝对定位的div的居中方法,下面的写法兼容IE系列浏览器和火狐浏览器。

    详细解说,直接看样式:#dingwei{padding:10px;background-color:#003300;color:#FFFFFF; width:600px;height:300px; d ...

随机推荐

  1. 从oracle数据库中导出excel问题导致乱码的问题

    使用plsqldev工具将oracle的查询结果导出为excel,结果可以成功导出,但是使用libreoffice进行查看时,有好多记录都是空的. 使用python进行导出(openpyxl模块进行e ...

  2. ASP.NET导出文件FileResult的使用

    本文给大家讲一下ASP.NET MVC中如何使用FileResult来导出文件,首先网上相关例子有很多大神都有讲,我在这只是稍微说一点不同——为什么我的导出没有反应呢? 这个问题,我找了半天也没有找到 ...

  3. 转:Log4j使用

    转:https://my.oschina.net/kkrgwbj/blog/638780 日志是应用软件中不可缺少的部分,Apache的开源项目log4j是一个功能强大的日志组件,提供方便的日志记录. ...

  4. C语言 结构体指针赋值 incompatible types when assigning to type 'char[20]' from type 'char *'

    strcpy(pstudent->name, "guo zhao wei "); 为什么错误,该怎么写,(红色行)     追问 为什么不能直接赋值啊, 追答 用char n ...

  5. Linux时间戳和标准时间的互转

      转http://hi.baidu.com/taolizao/blog/item/2d6f9a1ba50ef3eae0fe0ba9.html 在LINUX系统中,有许多场合都使用时间戳的方式表示时间 ...

  6. js数组中indexOf/filter/forEach/map/reduce详解

    今天在网上看到一篇帖子,如题: 出处:前端开发博客 (http://caibaojian.com/5-array-methods.html) 在ES5中一共有9个Array方法,分别是: Array. ...

  7. 怎样获取Windows平台下SQL server性能计数器值

    转载自工作伙伴Garrett, Helen "SQL Server Performance Counter captures" Capturing Windows Performa ...

  8. 【转】不容忽视的ClassNotFoundException

    转载地址:http://it.deepinmind.com/jvm/2014/04/11/classnotfoundexception-is-it-slowing-down-your-jvm.html ...

  9. ANGULAR JS WATCH监听使用(详)

    ANGULAR 监听使用: 当angular数据模型发生变化时,我们需要如果需要根据他的变化触发其他的事件. $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. ...

  10. Netsuite Formula > Oracle函数列表速查(PL/SQL单行函数和组函数详解).txt

    PL/SQL单行函数和组函数详解 函数是一种有零个或多个参数并且有一个返回值的程序.在SQL中Oracle内建了一系列函数,这些函数都可被称为SQL或PL/SQL语句,函数主要分为两大类: 单行函数 ...