父分隔符之外的分隔符答案

【问题标题】：dividers outside the parent divider父分隔符之外的分隔符
【发布时间】：2016-08-21 11:37:18
【问题描述】：

我正在尝试在另一个分隔器中添加两个分隔器，但我无法弄清楚如何强制子分隔器位于父分隔器内。

如何控制父分隔线内的子分隔线位置？

#graph-container {
  border: solid;
}
#graph-info {
  border: solid;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col-lg-12">
      <div class="panel with-nav-tabs panel-default">
        <div class="panel-heading">
          <ul class="nav nav-tabs" id="myTab">

            <li class="active"><a href="#home" class="backgroundRed" data-toggle="tab">Main </a>
          </ul>
        </div>
        <div class="panel-body">
          <div class="tab-content">
            <div class="tab-pane active" id="home">Main</div>
            <div class="container" id="graph_panel">
              <div class="row">
                <div class="container col-xs-12 col-sm-12 col-md-8 col-lg-8 bg-info " style="height: 800px;" id="graph-container">

                </div>
                <div class="container col-xs-12 col-sm-12 col-md-4 col-lg-4 bg-danger" style="height: 800px" id="graph-info">

                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

【问题讨论】：

标签： html css twitter-bootstrap

【解决方案1】：

您已经在.container > .row 中，因此无需在其中再添加一个。

See this bootply fiddle

【讨论】：

【解决方案2】：

将 width:auto 添加到您的#graph_panel

【讨论】：