简体   繁体   English

nboots中两个div元素之间不必要的空格

[英]Unnecessary white space between two div elements i nboots

I'm coding a website using bootstrap 4 and for some reason that I cant figure out, there is some space between my two wrapper div's in the following code.我正在使用 bootstrap 4 编写一个网站,出于某种我无法弄清楚的原因,以下代码中我的两个包装器 div 之间存在一些空间。

<!-- News! Ad with "read more" modal popup -->
<div id="news-bar" class="container-fluid bg-white my-0">
 <h2>News</h2>
    <p>Short Description</p>
    <p>more</p>
</div>

<!-- About us / Register for consultation -->
<div id="about-jumbotron" class="jumbotron jumbotron-fluid bg-dark text-white margin my-0">
    <div class="container-fluid">
        <h1>Big Heading</h1>
        <h2>Smaller heading</h2>
        <p>Description text</p>
    </div>
</div>

Here is an imgur link with a photo of my browser output.这是一个带有我的浏览器 output 的照片的 imgur链接 Sand brown line is the background-color set for my webpage.沙褐色线是为我的网页设置的背景色。

So far I've tried adding my-0 and py-0 to both #about-jumbotron and #news-bar with no success.到目前为止,我尝试将 my-0 和 py-0 添加到 #about-jumbotron 和 #news-bar 都没有成功。 Also, if i click on the empty space and select inspect element in my web browser it refers to the body tag.另外,如果我在我的 web 浏览器中单击空白区域和 select 检查元素,它指的是正文标签。 As an alternative solution I can set the background color to be the same as one of the div elements but I do want to first try to find a proper solution.作为替代解决方案,我可以将背景颜色设置为与其中一个 div 元素相同,但我确实想首先尝试找到合适的解决方案。

I solved it.我解决了。 The problem was that the the h1 and h2 elements had their own margins pushing the bottom downwards.问题是 h1 和 h2 元素有自己的边距将底部向下推。 it was fixed by setting my-0它是通过设置 my-0 来修复的

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM