两个<div>之间的间隙垂直对齐

时间:2017-03-13 15:08:18

标签: html css

除Firefox外,每个浏览器都有显示问题。 我实际上有这种类型的代码

<div id="conteneur">
  <div id="milieu">
    <div class="textPara">
      <div id="conteneur">
        <div id="cadre_selection_ecole">
          <form id="form_search">
            <input type="text" value="" />
            <script type="text/javascript">
              disableAutocomplete('search');
            </script>
            <div id="listerecherche" style="margin-top:-15px; text-align:left"></div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
<div id="footer">
  SOME TEXT
</div>

事实是“div id =”milieu“”和“div id =”footer“”之间存在差距。 我已经尝试过涉及向css添加一些浏览器webkits,字体大小等的解决方案。 当我使用代码检查器时,它向我显示这个差距只是一个无代码区域。

你会在这里找到the gap between the two divs

有什么建议吗?

2 个答案:

答案 0 :(得分:1)

您的问题是<form>默认高度已确定(至少在Chrome中为39px)。消除这个属性应该做的工作(也许你需要做额外的工作,因为设置<p>SOME TEXT</p>而不是纯文本。)

答案 1 :(得分:1)

正如RompePC所建议的那样(感谢),我尝试了最高等级的解决方案here。 我把它改编成了我的问题

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /* webkit specific CSS */
    div#milieu { height:0px; }
    div#footer { height:0px; }
}

我的问题现在已经解决了。

相关问题