css - 元素未在 twitter bootstrap tabbable 中显示完整尺寸

Question

我有一个谷歌图表，它在自己的页面中显示良好，/graph/map_freq但当我将其显示为选项卡内容时缩小了尺寸。

这是可选项卡的代码：

<div class="tab-pane" id="map_freq">
<%= render "graph/map_freq" %>
</div>

这是 graph/map_freq.html.erb 中的代码：

<div id="chart_div" style="width: 900px; height: 500px;"></div>

我很确定这与 Bootstrap 的 tabbable 组件有关。

Answer 1

你应该像这样标记它......

<ul class="nav nav-tabs" id="map_freq">
     <li class="active"><a data-toggle="tab" href="#featured-members">Your Tab Name</a></li>
</ul>

<div class="tab-content" id="yourId">
     <div id="map_freq" class="tab-pane active fade in">
       Your Content Here.
     </div>
</div>

该代码应输出类似于THIS ONE 的页面。