这本来是简单的配偶,但由于某种原因它变得复杂了。
我想要 <a>
中的文字标签垂直居中,就像提交输入的文本一样。
在 <a>
我知道它应该是 align-self: center;
但是当我这样做时,元素会失去它的高度。
这是我的代码。
.flex{
display: flex;
}
#form-buttons {
align-items: stretch;
font-weight: bold;
width: 300px;
height: 300px;
a {
align-self: stretch;
background-color: blue;
color: #fff;
width: 50%;
}
input[type="submit"] {
width: 50%;
background-color: black;
color: #fff;
border: 0px;
}
}
<div id="form-buttons" class="flex">
<input type="submit" name="front-side-prop-search" value="search">
<a href="#">view all results</a>
</div>
最佳答案
我要添加这两行(替换 align-self
prop):
a {
display: inline-flex;
align-items: center;
}
关于css - Flexbox 垂直对齐到父元素的中间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47028990/