Question

我有这种风格：

+----+---------+---------+---------+---------+
|    | col_1   |   col_2 | col_3   | col_4   |
|----+---------+---------+---------+---------|
|  0 | A       |       5 | c       | k       |
|  1 | A       |       9 | d       | k       |
|  2 | A       |       2 | k       | k       |
|  3 | B       |       3 | n       | f       |
|  4 | B       |       7 | l       | f       |
|  5 | B       |       1 | f       | f       |
+----+---------+---------+---------+---------+

该HTML附带：

ExtensionRegistry::getInstance()->isLoaded( 'Arrays' )

第二行是在单击按钮时绘制的Cytoscape js图形。但是，如果我未将GGplot2018 <- ggplot(sub2018, aes(x=Pressure, y=meanVWC, group=1)) + geom_line()+ geom_point() + labs(y= "Volumetric Water Content")+ geom_smooth(method = "lm",se = FALSE) GGplot2018的高度设置为#cytoscape-container { width: 100%; height: 100%; margin: 0 auto; /*border: 1px solid red;*/ } .cytoscape-parent { height: 800px; width: 100%; }之类的行高度始终为1，则不会绘制我的图表。如何将其设置为浏览器窗口高度的百分比（例如90％）？

<div class="container mt-5"> <div class="row"> <div class="col-xs-12"> <button class="btn btn-success" type="button" onclick="displayAll()">Draw All</button> <button class="btn btn-danger" type="button" onclick="clearAll()">Clear</button> </div> </div> <div class="row" > <div class="col-xs-12 cytoscape-parent" > <div class="w-100 h-100 d-inline-block" id="cytoscape-container"></div> </div> </div> </div>的大小是.cytoscape-parent的100％，这是我想要的，但是我想将父级设置为浏览器窗口高度的百分比...

Answer 1

function displayAll() {}
function clearAll() {}

#cytoscape-container {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: yellow;
}

.cytoscape-parent {
  height: 80vh;
  width: 100%;
  background: blue;
}

<div class="container mt-5">
  <div class="row">
    <div class="col-xs-12">
      <button class="btn btn-success" type="button" onclick="displayAll()">Draw All</button>
      <button class="btn btn-danger" type="button" onclick="clearAll()">Clear</button>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-12 cytoscape-parent">
      <div class="w-100 h-100 d-inline-block" id="cytoscape-container"></div>
    </div>
  </div>
</div>

Bootstrap 4-空行（最初）需要具有高度

1 个答案: