首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何从引导程序容器中删除空格?

如何从引导程序容器中删除空格?
EN

Stack Overflow用户
提问于 2020-10-14 23:48:02
回答 2查看 40关注 0票数 0

我有这个网站:https://acanhs.org/nhs-articles.html,出于某种原因,他们的容器中有很多空白。如何更改此元素的高度。

我的html:

代码语言:javascript
复制
<center>
    <section class="blog-posts grid-system">
      <div class="container">
        <div class="row">
          <div class="col-12">
            <div class="all-blog-posts">
            <center>
              <div class="row">
                <div class="col-lg-4">
                  <div class="blog-post">
                    <div class="blog-thumb">
                      <img src="articlepics/Fitness.jpg" alt="" class="article">
                    </div>
                    <div class="down-content">
                      &emsp;
                      <h4>Fitness</h4>
                      <ul class="post-info">
                        <li>Mohammad Al-Wazzan</li>
                        <li>3/11/2020</li>
                      </ul>
                    <div class="btn download" onclick="window.location='articlepdfs/Fitness.pdf';">
                        <div class="cloud">
                        <div class="arrow"></div>
                        </div>
                    </div>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <div class="blog-post">
                    <div class="blog-thumb">
                      <img src="articlepics/الأمير.jpg" alt="" class="article">
                    </div>
                    <div class="down-content">
                      &emsp;
                      <h4>الأمير الراحل … أمير الإنسانية</h4>
                      <ul class="post-info">
                        <li>Mohammad Al-Obaidi</li>
                        <li>3/10/2020</li>
                      </ul>
                    <div class="btn download" onclick="window.location='articlepdfs/الأمير الراحل … أمير الإنسانية.pdf';">
                        <div class="cloud">
                        <div class="arrow"></div>
                        </div>
                    </div>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <div class="blog-post">
                    <div class="blog-thumb">
                      <img src="articlepics/Uyghur.jpg" alt="" class="article">
                    </div>
                    <div class="down-content">
                      &emsp;
                      <h4>Uyghur Muslims</h4>
                      <ul class="post-info">
                        <li>Khalid Kooheji</li>
                        <li>27/9/2020</li>
                      </ul>
                      <div class="btn download" onclick="window.location='articlepdfs/Uyghur Muslims.pdf';">
                        <div class="cloud">
                        <div class="arrow"></div>
                        </div>
                      </div>
                      <div class="post-options">
                        <div class="row">
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <div class="blog-post">
                    <div class="blog-thumb">
                      <img src="articlepics/Corona.jpg" alt="" class="article">
                    </div>
                    <div class="down-content">
                      &emsp;
                    <h4>Corona Virus: A New World</h4>
                      <ul class="post-info">
                        <li>Majed Al-Shaheen</li>
                        <li>27/9/2020</li>
                      </ul>
                      <div class="btn download" onclick="window.location='articlepdfs/Corona Virus A New World.pdf';">
                        <div class="cloud">
                        <div class="arrow"></div>
                        </div>
                    </div>
                      <div class="post-options">
                        <div class="row">
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <div class="blog-post">
                    <div class="blog-thumb">
                      <img src="articlepics/اقرأ.jpg" alt="" class="article">
                    </div>
                    <div class="down-content">
                      &emsp;
                      <h4>التعلم عبادة</h4>
                      <ul class="post-info">
                        <li>Omar Sheir</li>
                        <li>23/9/2020</li>
                      </ul>
                      <div class="btn download" onclick="window.location='articlepdfs/التعلم عبادة.pdf';">
                        <div class="cloud">
                        <div class="arrow"></div>
                        </div>
                    </div>
                      <div class="post-options">
                        <div class="row">
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <div class="blog-post">
                    <div class="blog-thumb">
                      <img src="articlepics/الصدقة.jpg" alt="" class="article">
                    </div>
                    <div class="down-content">
                      &emsp;
                      <h4>الصدقة</h4>
                      <ul class="post-info">
                        <li>Ahmad Al-Mazrouei</li>
                        <li>20/9/2020</li>
                      </ul>
                      <div class="btn download" onclick="window.location='articlepdfs/الصدقة.pdf';">
                        <div class="cloud">
                        <div class="arrow"></div>
                        </div>
                    </div>
                      <div class="post-options">
                        <div class="row">
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              </center>
            </div>
          </div>
        </div>
      </div>
    </section>
    </center>

我可以添加什么来降低height?.

EN

回答 2

Stack Overflow用户

发布于 2020-10-14 23:55:54

您在顶部有页边距和填充,down.You可以尝试这些:

代码语言:javascript
复制
.blog-posts {
    margin-top: 0;
 }

.footer-distributed {
 background-color: #2c292f;
 box-sizing: border-box;
 width: 100%;
 text-align: left;
 font: bold 16px sans-serif;
 padding: 50px 50px 60px 50px;
 margin-top: 0;
}
票数 0
EN

Stack Overflow用户

发布于 2020-10-14 23:56:32

哦,谢谢大家,我已经改好了

代码语言:javascript
复制
.blog-posts .down-content {
    padding: 0px;
    border-right: 1px solid #eee;
    border-left: 1px solid #eee;
    border-bottom: 1px solid #eee;
    min-height: 45em;
}

代码语言:javascript
复制
.blog-posts .down-content {
    padding: 0px;
    border-right: 1px solid #eee;
    border-left: 1px solid #eee;
    border-bottom: 1px solid #eee;
    min-height: 35em;
}

在css文件中

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/64357039

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档