欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

css让浮动元素水平居中_html/css_WEB-ITnose

程序员文章站 2022-05-29 16:57:31
...
对于定宽的非浮动元素我们可以用 margin:0 auto; 进行水平居中。

对于不定宽的浮动元素我们也有一个常用的技巧解决它的水平居中问题。如下:

HTML 代码:

我是浮动的

我也是居中的

CSS 代码:

.box{    float:left;    position:relative;    left:50%;}p{    float:left;    position:relative;    right:50%;}

这样就解决了浮动元素水平居中了;

父元素和子元素同时左浮动,然后父元素相对左移动50%,再然后子元素相对右移动50%或者子元素相对左移动-50%也就可以了