以百分比为基础的div为中心

Question

最近,一位客户要求他的网站是基于百分比而不是基于像素的.百分比设定为80%.众所周知,如果容器是基于像素的,那么容器很容易居中,但是如何将基于百分比的主容器集中在一起呢？

#container
{
  width:80%;
  margin:0px auto;
}

这不是容器的中心:(

Answer 1

margin属性支持百分比值:

margin-left: 10%;
margin-right: 10%;

Answer 2

#container
{
  width:80%;
  position:absolute;
  margin-left:-40%;
  left:50%;
}

或者干脆

#container
{
  width:80%;
  margin-left:10%;
}