填充底部将不起作用

Question

如何使img浮动在右侧，底部填充50px？

当我插入我的代码时，图像底部只有50px的空白区域。

section img{ 
 
    float: right; 
 
    padding-right: 50px; 
 
    padding-bottom: 50px; 
 
}

<section> 
 
    <img src="if_60-rss_104443.png"> 
 
</section>

Answer 1

你只是忘了包括section元素。在你的CSS，你将样式应用于imgsection元素中，只需将其添加到您的HTML：当图像是section元素中

section img { 
 
    float: right; 
 
    padding-right: 50px; 
 
    padding-bottom: 50px; 
 
}

<section> 
 
    <img src="if_60-rss_104443.png"> 
 
</section>

Answer 2

你的CSS规则只适用。然后，它按预期工作（我加了一个红色边框进行论证）：

section img { 
 
    float: right; 
 
    padding-right: 50px; 
 
    padding-bottom: 50px; 
 
    border: 1px solid red; 
 
}

<section> 
 
    <img src="http://placehold.it/200x200/555"> 
 
</section>

Answer 3

如果你只是要对齐的部分图像，你可以使用文本对齐。

section { 
 
    text-align: right; 
 
    padding-right: 50px; 
 
    padding-bottom: 50px; 
 
}

<section> 
 
    <img src="if_60-rss_104443.png"> 
 
</section>