如何让2个div拥抱中心div？

Question

3个div：左/中/右。我想将中心div放在浏览器中间（850px）和其他2个div（每个225px）拥抱它。我怎么能做到这一点？我有一个容器，里面有3个div。有人可以帮助我

.container{

}


.left-content-area{
     width: 225px;
}

.main-content-area{
     width: 850px;
}

.right-content-area{
     width: 225px;
}

Answer 1

您可以将容器设置为所有子容器的宽度，并使其居中。然后将孩子们漂浮在一起。使用容器上的overflow样式使其包含子项（否则容器的高度为0，子项将显示在其外部）。

.container{
  margin: 0 auto;
  width: 1300px;
  overflow: hidden;
}


.left-content-area{
  float: left;
   width: 225px;
}

.main-content-area{
  float: left;
   width: 850px;
}

.right-content-area{
  float: left;
   width: 225px;
}

Answer 2

...试

.container{
   width:1300px;
   margin:auto;
}

.left-content-area{
     width: 225px;
   float:left;
}

.main-content-area{
     width: 850px;
    float:left;
}

.right-content-area{
     width: 225px;
    float:left;
}

保证金：auto给左边和右边的容器一个相等的边距，从而将它漂浮在中心。

Float：left表示divs彼此相邻，而不是从新行开始。