CSS3：iframe不占用100％的高度

Question

我有2个bootstrap列。

在第一列中有一个固定的位置div。在第二列我有一个iframe div。 我已经给出了 iframe height =“100％”，但它没有占据浏览器的100％。

.left_side_div{
  width:25%;
  min-height:100%;
  background : #FFFFFF;
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  border:thin black solid;
}

.iframe_div{
  width:100%;
  height:100%;
  border:thin black solid;
  
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<div class="row">
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
  <div class="left_side_div"></div>
</div>
<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
  <div class="iframe_div">
    <iframe src="http://google.co.in/" width="100%" height="100%"></iframe>
  </div>
</div>
</div>

这是JSFiddle

任何帮助都会很棒。

谢谢。

Answer 1

不要使用％作为高度insted使用100vh。

Answer 2

对行使用边距0

.row{
   margin: 0;
}