CSS水平居中

1.块级元素使用 margin的左右为auto设置

.center {
  margin-left: auto;
margin-right: auto;
}

2.利用position实现左右对齐

.right {
  position: absolute;
  right: 0px;
  widht: 300px;
}

3.浏览器关于position对齐的兼容性问题

body
{
margin:0;
padding:0;
}
.container
{
position:relative;
width:100%;
}
.right
{
position:absolute;
right:0px;
width:300px;
background-color:#b0e0e6;
}

解决IE8及以前版本会在右侧添加17px的外边距的问题
4.float实现左右对齐

.right {
  float: right;
}

5.float左右居中兼容性问题

body {
  margin: 0;
  padding: 0;
}
.right {
  float:right;
}

解决IE8及以前版本会在右侧添加17px的外边距的问题