我如何实现这种CSS效果（居中内容和填充）？

Question

我想知道如何才能达到这个效果。首先，内容目前位于名为“contentDiv”的div中。我有以下所有内容浮动：div的右边。我想要实现的是一个虚构的边界（看图像），其中的内容无法跨越。 然后我希望内容集中。 我如何用CSS实现这一目标？或者我可以用什么元素来复制这种效果。 我已经研究了内容的中心，这段代码对我有用 -

margin-left: auto;
margin-right: auto;

Answer 1

#contentDivParent {
    /*It will define the imaginary border*/
    padding-left:30%;
    width:70%;
}

#contentDiv {
  /*remove the float*/
  float:none;
  /*center*/
  margin:0px auto;
  /*force line-break*/
  max-width:100%;
}