删除填充底部的高度:自动

时间:2015-02-21 17:50:07

标签: html css padding

我正面临着css编码问题。我真的需要帮助解决这个问题。剪短故事,我有一个 div 的图像,这是我想要的滑动横幅 div 。但是,我想知道为什么在 div 中的图像下面会有一个填充,如果我将高度设置为auto(我将高度设置为auto,因为我想制作一个响应式布局)。无论我如何为图像设置0填充 div ,它都无法工作。我提供了一个链接来查看图像或查看实时网站。链接到附件http://www.ncc.my/resources/padding-issue.jpg或链接到网站http://www.ncc.my(此网站仍在进行中)。

我对div的css代码是:

#contentContainer .slides {width:1140px; height:auto float:left; background:#666;}
#contentContainer .slides img {width:100%; padding:0; margin:0; border:0;}

@media screen and (max-width: 850px)
{
#contentContainer .slides {width:100%;}
}

如果我将高度设置为我想要的指定高度,则布局非常完美。但是,当我再次将高度设置为 auto 时,肯定会出现问题,如附件中所示。解决这个问题的任何解决办法?非常感谢!

2 个答案:

答案 0 :(得分:1)

您需要在图片上添加display: block。所以你的CSS将是

#contentContainer .slides img {
    width: 100%;
    padding: 0;
    margin: 0;
    display: block; /* Add this */
    border: 0;
}

答案 1 :(得分:0)

也许尝试设置高度:100%而不是自动。这个答案更像是在黑暗中拍摄我不确定它是否会起作用。