我们在用css float的时候,如何让文本水平居中真的很麻烦,

[float]使div(或者其他标签)的宽度自适应其内容,但它却有个弊端:无法居中。
[display:inline-block]也有同样的特性,并且可以居中,但连续几个这样的东东,之间却会出现空格。

第一种方案:

<html>
<body style="text-align:center">
<div style="margin:0 auto;">
<div style="float:left">123243</div>
<div style="float:left">6576876</div>
<div style="float:left">2433665</div>
</div>
</body>
</html>

 第二种方案(推荐)

<html>
<body style="text-align:center">
<div style="display:inline-block; *display:inline; zoom:1;">
<div style="float:left">123243</div>
<div style="float:left">6576876</div>
<div style="float:left">2433665</div>
</div>
</body>
</html>

float后怎么居中的更多相关文章

  1. 子div设置float后导致父div无法自动撑开的问题

    子div设置float后会导致父div无法自动撑开 原因:内部的DIV因为float:left之后,就丢失了clear:both和display:block的样式,所以外部的DIV不会被撑开. 以下是 ...

  2. 前端页面div float 后高度 height 自适应的问题

    最近在画项目页面的时候遇到了一个左侧div一旦加上float:left 属性后,设置其高度height:100% 不起作用,后来网上查了半天也没有找到很好的解决方案,只在csdn里发现了这个马上记录下 ...

  3. UIScrollView中图片放大后不居中,或居中后移动有偏差解决办法

    转自:http://blog.sina.com.cn/s/blog_6ae8b50d0100yret.html 问题的描述如下:要显示一张图片,也只需要显示一张图片,该图片可能很大,也可能很小,但是要 ...

  4. HTML+CSS教程(六)浮动-float+定位-position+居中问题

    一.浮动(float)1.文档流:是指盒子按照 html 标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置 ...

  5. 子Div使用Float后如何撑开父Div

    如果想要撑开父元素可以采用以下方法: 方法一: 父元素设置overflow以及zoom,样式如下: 1 <style> 2   #div1{border:1px solid red;ove ...

  6. CSS: 解决Div float后,父Div无法高度自适应的问题

    在用CSS+DIV的布局中,常常会发现,当一个DIV float之后,假设他的高度超过了其父DIV的高度时,其父DIV的高度并不会对应的进行调整.要解决问题(也叫做闭合(清除)浮动),我们有四种办法: ...

  7. 学习笔记----float后不与前面元素同行解决办法。

    <li>文本<span> 16-08-17</span></li> 当非float的元素和float的元素在一起的时候(如上代码), 如果非float元 ...

  8. 子div设置float后会导致父div无法自动撑开

    本文是从简书复制的, markdown语法可能有些出入, 想看"正版"和更多内容请关注 简书: 小贤笔记 注: 文章部分转载 彩泉 - 博客园 原因:内部的DIV因为float:l ...

  9. 已知float后几位,谋几位保留

    设变量n为float类型,m为int类型,则以下能实现将n中的数值保留小数点后两位,第三位进行四舍五入运算的表达式____. #include "common.h" #includ ...

随机推荐

  1. uva 10034 Freckles (kruskal||prim)

    题目上仅仅给的坐标,没有给出来边的长度,不管是prim算法还是kruskal算法我们都须要知道边的长度来操作. 这道题是浮点数,也没啥大的差别,处理一下就能够了. 有关这两个算法的介绍前面我已经写过了 ...

  2. 【BIEE】BIEE 11g BI Publisher报表开发实例

    环境准备 JDK下载地址:直接去百度软件中心下载即可 BIPublisher下载地址:http://pan.baidu.com/s/1bpk03Jh 本例子中以win7 32位操作系统为例 1.安装已 ...

  3. [译] JavaScript 的事件循环

    译者注 本译文基本是按原文的意思来翻译,但对于 JavaScript 的事件循环,个人感觉还是 Philip Roberts 的视频讲解更形象些,思路和本文大致相同,不过他把事件表理解为 Web AP ...

  4. DevOpsDays 活动咨询网站

    站点:http://www.41huiyi.com/event-1452630998.html

  5. android端StarIO热敏打印机打印小票

    最近在做这个热敏打印机打印小票,开始的时候在网上找资料,发现国内基本没有这方面的资料,国外也很少,在此做个打印小票的记录. 这里只记录一些关键点. 使用StarIOPort.searchPrinter ...

  6. 零基础学python-1.5 第一个程序

    这一个章节我们来说说怎么建立一个python程序 1.打开idle 2.点击File->new file,然后会弹出一个编辑窗体 3.在编辑窗体里面输入命令代码 程序代码: print(&quo ...

  7. YUV图像合成原理

    http://blog.csdn.net/zwz1984/article/details/50403150 http://zhongcong386.blog.163.com/blog/static/1 ...

  8. python 中的"switch"用法

    转载:http://python.jobbole.com/82008/ 为什么Python中没有Switch/Case语句? 不同于我用过的其它编程语言,Python 没有 switch / case ...

  9. hdu 1811 Rank of Tetris(拓扑,并查集)

    题意:略 分析:排序先按rating,若相同,则按rp.考虑到每个人的rp均不同,所以rating相同的人必然可以排序.那么只需要考虑rating不同的集合了.  大小关系可以用有向边表示,而大小关系 ...

  10. Android Camera子系统之源码View

    本文基于Android 4.2.2+Linux3.6.9+SAMA5D3 SoC从源码的角度审视Android Camera子系统. 应用层 Androd原生Camera应用 /system/app/ ...