<div class="first_news">
<div class="top_new_header">
<div class="info">
<p>Sports / IPL</p>
<p>TT of India | Apr 19, 2018 | 22:03:25 IST</p>
</div>
<div class="image_heading">
<div class="img_heading_div">
<img src="https://static.toiimg.com/photo/msid-63716346/63716346.jpg?pl=63716346"/>
</div>
<h1>Rajasthan Royals vs Delhi Daredevils, Match 6, Jaipur - RR beat DD by 10 runs (DLS)</h1>
</div>
</div>
</div>
空间正确和底部
答案 0 :(得分:1)
内联标签倾向于填充空间的高度和宽度。您需要将img定义为父div中的块级项目。 img
标记不是块级元素。为了填补空白,请将此属性添加到您的css:
.img_heading_div img {
display: block;
}
答案 1 :(得分:0)
因为你的css的这一部分有border: 3px solid #fff;
:
.image_heading .img_heading_div{
width: 40%;
border: 3px solid #fff;
margin: 0px 15px 0px -23px;
display: inline-block;
}
答案 2 :(得分:0)
更改你的CSS
.img_heading_div img {
width: 130px;
height: 70px;
}
到这个
.img_heading_div img {
width: 100%;
height: 70px;
}
通过将宽度设置为100%,您告诉图像填充其父宽度,因此没有空间,并且我不确定为什么底部有空间