在工作中遇到一种情况,例如把一个div元素绝对定位到一个位置,但是该元素中的文字个数不确定,还要保证始终该文字是居中显示,则可以定义两个div,外层div绝对定位并加一个宽度,内层div居中

.box03 .percent {
position: absolute;
right: 31%;
top: 12%;
width: 100px;
font-family: arial;
font-weight: bold;
color: #e83522;
font-size: 1rem;
}
.box03 .percent span{
display: inline-block;
text-align: center;
width: 100%;
}

绝对定位多个字居中显示的css的更多相关文章

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

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

  2. CSS基础之居中显示

    这些天忙完了一些项目后,终于有时间来总结一下了.自己就把做项目过程中的体会和理解到的一些东西和大家分享一下.有错请指正!! 在css中,元素居中显示,是基础也是一个小难点.我们经常不知为何总是不能把元 ...

  3. css 图片内容在不同分辨率下居中显示(演示的图片宽度是1920px,当图片宽度大于显示屏的宽度时)

    1.img 图片内容在不同分辨率下居中显示(如果隐藏多余,在img外面套一个div  设定overflow: hidden.div的大小就是img显示区域的大小) <!DOCTYPE html& ...

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

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

  5. CSS——盒子居中显示

    嵌套中个的子盒子使用了绝对定位,父盒子使用了相对定位.那么子盒子如何居中显示: 1.距离左偏离50% 2.margin-right子盒子宽度的一半 <!DOCTYPE html> < ...

  6. CSS文本居中显示

    因为一直为元素居中问题而困扰,所以决定把自己遇到和看到的方法记录下来,以便以后查看 如果要让inline或inline-block元素居中显示,则父元素css中包含text-align:center; ...

  7. 简单两步使用css控制div下导航栏ul居中显示

    第一步:父层设置文本居中属性 ul{ text-align:center; } 第二步:li设置内联样式 li{ display:inline; } PS 只需以上两步就可以实现导航栏居中显示了,但为 ...

  8. css实现一行居中显示,两行靠左显示,超过两行以引号省略

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. css 字体上下居中显示 解决安卓手机line-height的偏差

      1.字体左右居中显示 text-align: center   <div class="font"> 上下居中 </div> .font{ width: ...

随机推荐

  1. 设置定时任务(Timer类的介绍)

    设置定时任务(Timer类的介绍) 在我们的很多项目中,我们都须要用到定时任务,因此想借此博文来对定时任务进行一个介绍. 设置定时任务过程例如以下: 先new一个Timer对象 Timer timer ...

  2. WPF样式继承

    场景:样式A和样式B的背景颜色一样,但是文字颜色不一样 <Style x:key="BaseStyle" TargetType="Button"> ...

  3. REST接口调用经验

    1. 调用接口的时候对于参数或返回值的单位一定要注意啊,比如有的分数用的百分制,有的用的小数...,坑大了

  4. Redis提供的持久化机制(二)

    1.前言 Redis是一种高级key-value数据库.它跟memcached类似,不过数据可以持久化,而且支持的数据类型很丰富.有字符串,链表,集 合和有序集合.支持在服务器端计算集合的并,交和补集 ...

  5. oozie 客户端常用命令

    1.提交作业,作业进入PREP状态 oozie job -oozie http://localhost:11000/oozie -config job.properties -submit job: ...

  6. 三篇文章了解 TiDB 技术内幕——说存储

    数据库.操作系统和编译器并称为三大系统,可以说是整个计算机软件的基石.其中数据库更靠近应用层,是很多业务的支撑.这一领域经过了几十年的发展,不断的有新的进展. 很多人用过数据库,但是很少有人实现过一个 ...

  7. PHP判断字符串的包含

    PHP语言是一个功能强大的嵌入式HTML脚本语言,它的易用性让许多程序员选择使用.PHP判断字符串的包含,可以使用PHP的内置函数strstr,strpos,stristr直接进行判断.也可以通过ex ...

  8. -26628 loadrunner

    在Vuser脚本编译执行无误情况下,在controller中进行并发操作,并发数设为10,只通过5个,失败的报错信息是:   Action.c(15): Error -26628: HTTP Stat ...

  9. 清华DNS

    DNS: 166.111.8.28 166.111.8.29 FQ方式:http://www.cnblogs.com/huangshiyu13/p/6227068.html

  10. Java如何设置线程的优先级?

    在Java编程中,如何设置线程的优先级? 以下示例如何使用setPriority()方法来设置线程的优先级. package com.yiibai; public class SettingPrior ...