为什么填充对我的标签元素不起作用? [英] Why is the padding not working on my label elements?

问题描述

我在这里有一些标记:

<label>Username:</label>

<div class="input small"><div class="left"></div><div class="right"></div><div class="center">
    <input name="username" type="text" />
</div></div>

<label>Password:</label>

<div class="input small"><div class="left"></div><div class="right"></div><div class="center">
    <input name="password" type="password" />
</div></div>

和CSS:

label {
    padding-top: 5px;
}

由于某种原因，我的两个标签元素上的填充不起作用.在IE和Firefox中进行了尝试，但在两种情况下均无法正常工作. Firebug说有填充，但是什么也没做.尝试将填充设置为50px，但仍然没有.

For some reason, the padding on my two label elements is not working. Tried in IE and Firefox, and it isn't working in either case. Firebug says the padding is there, but it just isn't doing anything. Tried setting the padding to 50px, and still nothing.

有什么想法吗?

推荐答案

label是内联元素，因此不受顶部和底部填充的影响.您需要将label设为块级元素才能使其起作用:

A label is an inline element and so is not affected by top and bottom padding. You need to make the label a block level element for it to work:

label{
    display: block; /* add this */
    padding-top: 5px;
}

这篇关于为什么填充对我的标签元素不起作用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！