如何移除实际按钮/样式标签旁边的小按钮



我有一个提交按钮,我用标签样式。由于某种原因,未样式按钮的迷你按钮保留在样式按钮的左侧,并且两者都是可单击的。整个东西在浏览器中看起来是这样的。
我怎么摆脱它?我不想让它不可见,因为这样样式按钮就不会正确居中。

[type="file"], [type="submit"]{
height: 0;
overflow: hidden;
width: 0;
}
[type="file"] + label, [type="submit"] +label {
background: #f15d22;
border-radius: 5px;
color: #fff;
cursor: pointer;
display: inline-block;
font-family: 'Rubik', sans-serif;
font-size: inherit;
font-weight: 500;
margin-bottom: 1rem;
outline: none;
padding: 1rem 50px;
position: relative;
transition: all 0.3s;
vertical-align: middle;
}
[type="submit"] +label {
background: #2286f1;
}
<div align="center">
<button type="submit" id="send" [disabled]="!uploadForm.valid"></button>
<label for="send">Upload & Create</label>
</div>

只需将display:none添加到您的按钮中。

<button type="submit" id="send" [disabled]="!uploadForm.valid" style="display: none;"></button>

这里有一个简短的内联样式解决方案,但你可以很容易地将其添加到CSS类中。

最新更新