html - CSS3 : Space between left panel and an iframe div

Question

我有 2 个 div。一个带有固定的左面板，在第二个 div 中我有一个 iframe。

我在左侧面板和 iframe div 之间留有微小的空间。我的笔记本电脑得到了正确的输出。但在另一台笔记本电脑中，我在左侧面板和 iframe 之间留有空间。

我该如何修复它们？

Note : I have given width to left panel in Pixel. I don't want to give in percentage. as I want its width to be fixed even If I make it responsive.

.left_panel_div{
  position:fixed;
  height:100%;
  width:320px;
  min-height:100%;
  background:gray;
  float:left;
}

.iframe_div{
  float: left;
    height: 100vh;
    min-width: 100%;
    overflow: hidden;
}

<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_panel_div"></div>
</div>

<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9 padding_left_0">
  <div class="iframe_div">
  <iframe src="http://google.com/" width="100%" height="100%"></iframe>
  </div>
</div>

</div>

在图片中，2个div之间有一个空格。我怎样才能删除空间以使其在所有笔记本电脑、台式机上看起来都一样？

任何帮助都会很棒。

谢谢。

Answer 1

iframe 标记的默认浏览器样式使其具有灰色的 2 像素宽边框。您可以删除边框。只需为其添加一些 CSS 样式即可:

.iframe_div iframe { border: none; }