相关疑难解决方法(0)
Flexbox无法处理按钮或字段集元素
我试图<button>用flexbox的中心元素的中心元素justify-content: center.但Safari并不以它们为中心.我可以将相同的样式应用于任何其他标记,并且它按预期工作(请参阅<p>-tag).只有按钮左对齐.
尝试Firefox或Chrome,您可以看到差异.
是否有任何用户代理样式我必须覆盖？或者这个问题的任何其他解决方案？
div {
display: flex;
flex-direction: column;
width: 100%;
}
button, p {
display: flex;
flex-direction: row;
justify-content: center;
}<div>
<button>
<span>Test</span>
<span>Test</span>
</button>
<p>
<span>Test</span>
<span>Test</span>
</p>
</div>还有一个jsfiddle:http: //jsfiddle.net/z3sfwtn2/2/
78
推荐指数
推荐指数
2
解决办法
解决办法
3万
查看次数
查看次数
在按钮上使用display flex使其包装在Firefox中
出于某种原因,使用这样的显示Flex会导致项目在Mozilla中包装一个ontop.是否有一个原因？在Chrome中它工作正常,它们位于中间的一行.
火狐
铬
button.primary {
display: -webkit-flex;
display: -moz-flex;
display: flex;
align-items: center;
padding: 10px 20px;
}
svg {
width: 15px
}<button class="primary add-student">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0" y="0" viewBox="15.6 15.6 114.7 114.7" enable-background="new 15.6 15.6 114.7 114.7" xml:space="preserve" class="plus">
<path d="M128.1 59.6c-1.5-1.5-3.4-2.3-5.5-2.3H88.6V23.5c0-2.2-0.8-4-2.3-5.5 -1.5-1.5-3.4-2.3-5.5-2.3H65.2c-2.2 0-4 0.8-5.5 2.3s-2.3 3.4-2.3 5.5v33.9H23.5c-2.2 0-4 0.8-5.5 2.3s-2.3 3.4-2.3 5.5v15.6c0 2.2 0.8 4 2.3 5.5 1.5 1.5 3.4 2.3 5.5 2.3h33.9v33.9c0 2.2 0.8 4 2.3 5.5 1.5 1.5 3.4 2.3 5.5 2.3h15.6c2.2 0 4-0.8 …4
推荐指数
推荐指数
2
解决办法
解决办法
1052
查看次数
查看次数