不固定宽度的div居中显示
对于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居中显示的更多相关文章
- 设置div中的div居中显示
设置div中的div居中显示 方法一. <div class='big'> <div class='small'>box1</div> </div> s ...
- DIV居中显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 让几个横向排列的浮动子div居中显示的方法
div设置成float之后,就无法使子div居中显示了,那么如何让几个横向排列的浮动的div居中显示呢,下面有个不错的方法,希望对大家有所帮助 div设置成float之后,在父div中设置text-a ...
- 多个div居中显示
页面中有多个div时我们希望并排居中显示,可以通过在并排显示的div上一层再加一个div,设定宽度,然后让其居中显示达到需要的效果. 关键是要对外层div设定宽度. <!DOCTYPE html ...
- css div居中显示的4种写法
Demo:http://www.feman.cn/h5/center.html .absolute 绝对定位 这是我们最常用的一种居中定位写法 要求必须确定div的宽高度 目前市面上的浏览器基本上都支 ...
- div 居中显示
<html lang="en"> <head> <meta charset="UTF-8"> <title>di ...
- 【HTML】div居中显示
方法1: .parent { width:800px; height:500px; border:2px solid #000; position:relative; } .child { width ...
- 使用inline-block,使前面img,后面空div居中显示在一行后,导致当div中有内容时,div下移问题
.pro_li img,.pro_sm{display: inline-block; *display:inline;*zoom:1;vertical-align: middle ;} 解决方法:使用 ...
- 【转】div居中代码 DIV水平居中显示CSS代码
原文地址:http://www.divcss5.com/rumen/r622.shtml 如何使用CSS让DIV居中显示,让div水平居中有哪些CSS样式呢? 需要的主要css代码有两个,一个为tex ...
随机推荐
- 事件轮询 event loop
Understanding the node.js event loop The first basic thesis of node.js is that I/O is expensive: So ...
- 消息队列 概念 配合SpringBoot使用Demo
转http://www.jianshu.com/p/048e954dab40 概念: 分布式消息队列 ‘分布式消息队列’包含两个概念 一是‘消息队列’,二是‘分布式’ 那么就先看下消息队列的概念,和为 ...
- NoReverseMatch at /salesman/zhuce/ Reverse for '/zhuce/' with arguments '()' and keyword arguments '{}' not found. 0 pattern(s) tried: []
NoReverseMatch at /salesman/zhuce/ Reverse for '/zhuce/' with arguments '()' and keyword arguments ' ...
- vue的组件(先学习其他的ES6知识,之后再看这个) (未完)
https://blog.csdn.net/qq20004604/article/details/56965703
- hdu 4771 Stealing Harry Potter's Precious (2013亚洲区杭州现场赛)(搜索 bfs + dfs) 带权值的路径
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4771 题目意思:'@' 表示的是起点,'#' 表示的是障碍物不能通过,'.' 表示的是路能通过的: ...
- Tomcat下配置多个Project的虚拟主机
server.xml中,添加<Context path="/project2" docBase="D:\MyProjects\project2\WebContent ...
- Zabbix exp编写
#/usr/bin/python #*-*coding=utf-8*-* import urllib logo = '''\n _____ _ _ _ _____ _ |__ /__ _| |__ | ...
- jquery仿jquery mobile的select控件效果
不说废话.直接上代码 //仿jQuery mobile Select控件 //使用方法box为容器id,_id指控件id,selectvalue为选中值,Value为当前值 function Sele ...
- ecmall的物流配送体系改造
接触多了ecshop.ecmall原始逻辑的,一般都习惯以整单的方式统一计算运费,这是一种很简单的思路. 但淘宝多了,就发现,物流运费没有那么简单. 首先,每种商品单独设置运费的体系,或者叫运费模板: ...
- I帧、B帧、P帧、NALU类型
i帧 i frame,即内部画面 intra picture,通常是GOP的第一个帧(即IDR)I帧是最大去除图像空间冗余信息而压缩得到的帧,自带全部信息,不参考其他帧可独立解码,称为帧内编码帧所有视 ...