我刚刚在输入文本类型后添加了一个链接标记,但是当我查看该网站时,链接会在输入顶部显示,因为您可以在照片上看到并且看不到任何错误。 也许有一个我不知道的重置css。
a.activate {
background-color: pink;
padding: 10px;
}
<div class="cont bonus">
<h3>You have no active Bonus on your account</h3>
<h4>Got a Bonus code?</h4>
<input class="input" type="text" name="bonuscode" placeholder="Bonus Code">
<br>
<div id="activate">
<a class="activate" href="#">Activate</a>
</div>
</div>
答案 0 :(得分:2)
那是因为您的链接是内联元素。您添加的填充对于内联元素的行为与块元素的行为不同。
将您的链接设为display: inline-block;
a.activate {
background-color: pink;
padding: 10px;
display: inline-block;
}
&#13;
<div class="cont bonus">
<h3>You have no active Bonus on your account</h3>
<h4>Got a Bonus code?</h4>
<input class="input" type="text" name="bonuscode" placeholder="Bonus Code">
<br>
<div id="activate">
<a class="activate" href="#">Activate</a>
</div>
</div>
&#13;
内联元素仅占用由定义内联元素的标记限定的空间。
答案 1 :(得分:2)
只需添加显示块即可输入。无需改变任何东西。
input{
display:block;
}