【问题标题】:Lessen Space between content and footer缩小内容和页脚之间的空间
【发布时间】:2018-04-23 07:42:39
【问题描述】:

我正在为新闻稿制作主页。

我的content 和我的footer 之间有很大的空间,这是我不想要的。我尝试在 css 中使用margin-top: 0px,但这没有帮助。我还尝试了很多其他 marginpadding 设置,但我就是无法得到我想要的结果。

有人可以帮忙吗?提前致谢。

这是我网站的图片:

这是我的代码:

@extends('Press_Release_Views.layout')
    @section('content')
    <img src="/Picture/background.jpg">
    <div class="container">
    <div class="recent_border">
    <h4 class="Recent">Recent News Releases</h4>
    </div>
    <div class="col-md-4">
            <img src="/Picture/sample1.jpg" alt="Lights" class="sample1">
    </div>
    <div class="col-md-4">
    <p class="october">October 31,2017</p>
    <p class="lorem">Lorem Ipsum is simply dummy </p>
     <p class="paragraph1">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
    </div>
    <div class="border">
    </div>
    <div class="col-md-3">
            <img src="/Picture/sample2.jpg" alt="Lights" class="sample2">

    </div>
    <p class="October1">October 12,2017</p>
    <p class="lorem1">Lorem Ipsum is simply dummy </p>
    <div class="border1">
    </div>
    <div class="col-md-3">
            <img src="/Picture/sample2.jpg" alt="Lights" class="sample3">

    </div>
    <p class="October2">October 12,2017</p>
    <p class="lorem2">Lorem Ipsum is simply dummy </p>
    <div class="col-md-3 thumbnail3">
            <img src="/Picture/sample3.jpg" alt="Lights" class="sample4">

    </div>
    <p class="October3">October 12,2017</p>
    <p class="lorem3">Lorem Ipsum is simply dummy </p>

    <div class="col-md-3">
            <img src="/Picture/sample3.jpg" alt="Lights" class="sample5">

    </div>
    <p class="October4">October 12,2017</p>
    <p class="lorem4">Lorem Ipsum is simply dummy </p>
    <button type="button" class="btn btn-danger button_red">Browse All Recent Release</button>
    <div class="News_border">
    <h4 class="more_news">More News</h4>
    </div>

    <div class="col-md-3">
            <img src="/Picture/sample4.jpg" alt="Lights" class="sample6">

    </div>
    <p class="October5">October 12,2017</p>
    <p class="lorem5">Lorem Ipsum is simply dummy </p>

    <div class="col-md-3">
            <img src="/Picture/sample4.jpg" alt="Lights" class="sample7">

    </div>
    <p class="October6">October 12,2017</p>
    <p class="lorem6">Lorem Ipsum is simply dummy </p>

    <div class="col-md-3">
            <img src="/Picture/sample4.jpg" alt="Lights" class="sample8">

    </div>
    <p class="October7">October 12,2017</p>
    <p class="lorem7">Lorem Ipsum is simply dummy </p>

    <div class="col-md-3">
            <img src="/Picture/sample4.jpg" alt="Lights" class="sample9">

    </div>
    <p class="October8">October 12,2017</p>
    <p class="lorem8">Lorem Ipsum is simply dummy </p>
    <button type="button" class="btn btn-danger button_red1">Browse All Recent Release</button>
    </div>  
    @endsection

【问题讨论】:

  • 在内容上做margin-bottom:0,并且不要粘贴刀片发布已解析的html和css
  • 我已经修好了 :) 谢谢你的帮助 :)

标签: html css laravel bootstrap-4


【解决方案1】:

定位 div 并使用:margin-bottom: 0px;

【讨论】:

  • 你的意思是 margin-bottom:0; 作为我提供的评论
猜你喜欢
  • 2014-01-20
  • 2021-08-18
  • 1970-01-01
  • 2022-10-12
  • 2012-07-07
  • 2017-11-06
  • 2021-10-25
  • 2017-05-25
  • 1970-01-01
相关资源
最近更新 更多