div中没有​​图片

Question

在下图中，我在黄色div中有一个图像。我不喜欢左边，右边和上边距，但我想保留下边距以便我以后可以添加文字，那么如何摆脱这些边距呢？我仍然希望在顶部保持圆角。

http://s16.postimg.org/i1r2kfy5v/Screen_Shot_2015_07_31_at_11_35_27_PM.png

如您所见，代码很简单：

<div>
  <div>
    <a ...><img ...></a>
  </div>
  <div>
    <p>...</p>
  </div>
</div>

========== update =============

更具体地说，我刚刚创建了一个jsfiddle测试：

http://jsfiddle.net/wpp3ejer/5/

所以基本上我希望黄色块是固定宽度，但我不想要左/右/顶部填充。当没有上边距时，我无法使顶角变圆，而且我也无法摆脱右边距。

Answer 1

当你有一个图像时，

overflow: hidden将有助于保持圆角。检查一下 - JSFiddle

HTML

<div class="photocard">
  <a>
    <img src="http://filepic.ru/file/1438412560.jpg" alt="" />
  </a>
  <p>This is Emely</p>
</div>

CSS

body {
    background-color: lightgray;
}
.photocard {
    background-color: #fffadc;
    display: block;
    width: 364px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    overflow: hidden;
    -webkit-box-shadow: 2px 2px 10px 0 rgba(0,0,0,.4);
    box-shadow: 2px 2px 10px 0 rgba(0,0,0,.4);
}
.photocard p {
    text-align: center;
    margin: 0;
    padding: 20px;
}

Answer 2

为包含图片的div添加id属性。然后将此css添加到您的页面：

#yourDivId{
margin-top:0px;
margin-left:0px;
margin-right: 0px;
}

Answer 3

您可以查看以下链接。我已经给你上了图像div，并给了它样式。

http://jsfiddle.net/4wz688o1/8/

.hello{
margin:0px 0px 100px 0px;

}