html - 如何居中对齐多个DIV元素

Question

大家好，我正在学习 HTML 和设计网页模板。在将所附屏幕截图的团队成员设置为中心时，我陷入了困境。我想将团队成员设置为居中，但我的下面的代码不起作用。

<!----team-members---->
<div class="team-members" align="center">
    <div class="container" >
        <div class="col-md-3 team-member">
            <div class="team-member-info">
                <img class="member-pic" src="images/team-member4.jpg" title="name" />
                <h5><a href="#">Jonh Doe eh</a></h5>
                <span>Lead Designer</span>
            </div>
        </div><!--- end-team-member --->
        <div class="col-md-3 team-member">
            <div class="team-member-info">
                <img class="member-pic" src="images/team-member1.jpg" title="name" />
                <h5><a href="#">Amanda Fenrnicas</a></h5>
                <span>Lead Developer</span>
            </div>
        </div><!--- end-team-member --->
    </div>
<!--//team-members---->

更新

请在这里查看我的CSS http://pastebin.com/MrbUKbzY

提前致谢。

Answer 1

如果您正在学习，请参阅:http://jsbin.com/momefi/2/edit

  <div id="parent">
    <div class="child">
      <img src="//placehold.it/160x200/cf5&text=John">
      <p>Lorem ipsum dolor sit amet adipiscing elit amantis sinus tus</p>
    </div>
    <div class="child">
      <img src="//placehold.it/160x200/f0f&text=Anna">
      <p>Lorem ipsum dolor sit amet adipiscing elit amantis sinus tus</p>
    </div>
  </div>

#parent{
  border:1px solid #666;
  text-align:center;
}
.child{
  width:160px;
  display:inline-block;
  vertical-align:top;
}