0
行を同じ高さで使用してサイトを応答性に保つにはどうすればよいですか？例えば、私は2つのx_panelが内部に行と列を持っていますが、高さが違う、私はディスプレイフレックスを使用しようとしましたが、列内で変化します...行の同じ高さですか？
ここで私がしようとしていることを理解するコードです：私は同じ高さで、この2つの列を「同期」したい
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
\t <div class="col-md-6 col-sm-6 col-xs-12">
\t \t <div class="x_panel tile">
\t \t \t <div class="x_content">
\t \t \t \t <div class="row x_title">
\t \t \t \t \t <h3>Ponto de Venda:<small id="node_name"></small></h3> \t \t \t \t \t \t \t
\t \t \t \t </div>
\t \t \t \t <div class="row">
\t \t \t \t \t <div class="col-md-12 col-sm-12 col-xs-12"> \t
\t \t \t \t \t \t <div class="col-md-5 col-sm-5 col-xs-12">
\t \t \t \t \t \t \t <h5>Período de Avaliação:</h5>
\t \t \t \t \t \t </div>
\t \t \t \t \t \t <div class="col-md-7 col-sm-7 col-xs-12">
\t \t \t \t \t \t \t <div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; width: 100%; text-align: center; border: 1px solid #ccc">
\t \t \t \t \t \t \t \t <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
\t \t \t \t \t \t \t \t <span id="grafico_medias"></span> <b class="caret"></b>
\t \t \t \t \t \t \t </div>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t \t <div class="row tile_count text-center">
\t \t \t \t \t <div class="col-md-4 col-sm-12 col-xs-12 tile_stats_count">
\t \t \t \t \t \t <span class="count_top"><i class="fa fa-user"></i> Total de Pedestres</span>
\t \t \t \t \t \t <div id="displayPedestres" class="count"></div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="col-md-4 col-sm-12 col-xs-12 tile_stats_count">
\t \t \t \t \t \t <span class="count_top"><i class="fa fa-eye"></i> Visualizações</span>
\t \t \t \t \t \t <div id="displayInteracoes" class="count"></div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="col-md-4 col-sm-12 col-xs-12 tile_stats_count">
\t \t \t \t \t \t <span class="count_top"><i class="fa fa-refresh"></i> Taxa de Conversão</span>
\t \t \t \t \t \t <div id="displayTaxa" class="count green"></div>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </div>
\t <!-- /Informacoes medias -->
\t <!-- Meta -->
\t <div class="col-md-6 col-sm-6 col-xs-12">
\t \t <div class="x_panel tile">
\t \t \t <div class="x_content">
\t \t \t \t <div class="row x_title">
\t \t \t \t \t <h3>Meta</h3> \t \t \t \t \t \t \t
\t \t \t \t </div>
\t \t \t \t <div class="col-md-7 col-sm-12 col-xs-12">
\t \t \t \t \t <div class="row"> \t \t
\t \t \t \t \t \t <div class="col-md-3 col-sm-6 col-xs-6"> \t \t \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t \t <h5>Meta do</h5>
\t \t \t \t \t \t </div> \t \t \t \t \t \t \t \t \t
\t \t \t \t \t \t <div class="col-md-9 col-sm-6 col-xs-6" style="text-align: right">
\t \t \t \t \t \t \t <select id="metaPeriodo" onchange="meta()" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; width: 100%; text-align: center; border: 1px solid #ccc">
\t \t \t \t \t \t \t \t <option>dia</option>
\t \t \t \t \t \t \t \t <option>mês</option>
\t \t \t \t \t \t \t \t <option>trimestre</option>
\t \t \t \t \t \t \t </select>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="row">
\t \t \t \t \t \t <div class="col-md-3 col-sm-6 col-xs-6"> \t
\t \t \t \t \t \t \t <h5>em</h5>
\t \t \t \t \t \t </div> \t
\t \t \t \t \t \t <div class="col-md-9 col-sm-6 col-xs-6" style="text-align: right">
\t \t \t \t \t \t \t <select id="metaVariavel" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; width: 100%; text-align: center; border: 1px solid #ccc" id="tipo_meta" onclick="meta()">
\t \t \t \t \t \t \t \t <option>pedestres</option>
\t \t \t \t \t \t \t \t <option>visualizações</option>
\t \t \t \t \t \t \t \t <option>taxa de conversão</option>
\t \t \t \t \t \t \t </select>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t \t <br>
\t \t \t \t \t <div class="row">
\t \t \t \t \t \t <div class="col-md-12 col-sm-12 col-xs-12">
<input id="metaInput" type="text" class="form-control has-feedback" placeholder="Insira aqui a meta" style="height: 68px; font-size: 40px; font-weight: 600; color: #73879C; text-align: center">
</div>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t \t <div class="col-md-5 col-sm-12 col-xs-12">
\t \t \t \t \t <div class="row">
\t \t \t \t \t \t <div class="sidebar-widget text-center">
\t \t \t \t \t \t \t <h4 style="text-align: center;">Cumprimento da Meta</h4>
\t \t \t \t \t \t \t <canvas width="140" height="80" id="foo" class="" style="width: 150px; height: 100px;"></canvas>
\t \t \t \t \t \t \t <div class="goal-wrapper" style="text-align: center;">
\t \t \t \t \t \t \t \t <span class="gauge-value pull-center"></span>
\t \t \t \t \t \t \t \t <span id="gauge-text" class="gauge-value pull-center"></span>
\t \t \t \t \t \t \t </div>
\t \t \t \t \t \t </div>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </div> \t \t \t \t \t
\t <!-- /Meta -->
</div>は、画面の大きさを問題では、あなたが私を助けることができないのですか？
EDIT
フィドル：https://jsfiddle.net/5nzcpj3s/
私は理解しやすくするために、私は新しいCSSクラスを追加
をあなたがフィドルを設定することができますか？ –
あなたのCSSで明確にすることはできますか？あなたのHTMLをブートストラップライブラリにリンクしました、そうですか？ –
申し訳ありませんが、私はコードを –