2

col-lg-1、col-lg-1、col-lg-4、col-lg-6 (左から右) の 4 つの Bootstrap 列があります。

最大の列 (col-lg-6) には、Cytoscape グラフが必要です。現在、私のCytoscapeスタイルは次のとおりです（<head>セクション内）：

<style type="text/css">
#cy {
      height: 80%;
      width: 50%;
      position: absolute;
      left: 40%;
      top: 20%;
      background:red;
  }
</style>

次に、本文セクションには、左端の列があります。

<div id="cy" class="col-lg-6" style="background-color:grey;">
Some text 

</div>

最後に、HTML ドキュメントの body セクションにもスクリプトを含めます。

<script type="text/javascript">
$( document ).ready(function() {

var cy = cytoscape({
    container: document.getElementById('cy'),
    .....
});

});

</script>

現在の問題は、Cytoscape グラフ (および一番左の列) が、ブラウザーのサイズが変更されたときに (Bootstrap の動作で予想されるように) 他の列の下にスタックされないことです。

これに対する何らかの詳細な解決策を教えてください。あなたの専門知識に感謝します。

4

2 に答える 2