html - html 元素之间不需要的间距

标签 html css

我的两个元素(content1 和页脚)之间似乎有填充。我不想要这个“填充”,但我根本不明白为什么它在那里。这是有问题的 html 文本的一部分 - “填充”仍然出现。我尝试将 padding: 0 和 margin: 0 添加到两个元素中,但没有结果。

<style type="text/css">
body{
    margin: 0;
}
.footer{
    position: relative;
    width: 100%;
    min-width: 512px;
    height: 150px;
    background-color: black;
    font-size: 12px;
    font-family: arial;
    color: gray;
    z-index: 5;
}
.content1{
    position: relative;
    width: 100%;
    height: 300px;
    background-color: #E6E6E6;
    z-index: 5;
}
.imagecontainer{
    height: 80%;
    float: right;
}
.image{
    position: relative;
    display: block;
    height: 100%;
}
</style>
<body>
    <div class="content1">
        <!--<div class="textcontainer">
            <p style="color: gray; font-size: 15px; font-family: arial;">this is some text</p>
    </div>-->
        <div class="imagecontainer">
            <img class="image" src="C:\Users\wrigh\Pictures\SWITCH\capture01.png"></img>
        </div>
    </div>

    <div class="footer">
        <center><p style="padding-top:50px; max-width: 50%;">ONLY AVAILIBLE ON ANDROID<br><br>UPDATE: NO CURRENT WORK IS SCHEDULED</p></center>
    </div>
</body>

回应这个问题的建议答案。我已经从文本中删除了图像,不幸的是“填充”没有被删除。

最佳答案

看来你的段落标签有边距。

应用此 css 规则:

.footer p {
   margin: 0;
}

这是一个fiddle

关于html - html 元素之间不需要的间距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32682009/

相关文章:

javascript - 用于向页面添加 .css 和 .js 文件的 Firefox 附加组件

php - 如何在 php 中的按钮中启用自动换行?

jquery - 有没有办法在同一时隙中在其他事件后面全 Angular 显示 FullCalendar 事件?

html - 扩展模板不适用于 FOSUserBundle 电子邮件。交响乐2

html - 如何确保跨度始终出现在可能调整大小的 div 内的文本区域的右侧?

javascript - (php/jquery) 根据另一个选中的复选框值隐藏和显示复选框

css - 背景图像过渡不适用于 Firefox

jquery - li 菜单选项卡以填充页面宽度(平均)

html - 方向 : rtl with text-align: center doesn't work

html - Bootstrap 列顺序