本文介绍了是< button>允许显示:网格?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
或更笼统地说,有没有任何元素不能用display:grid
设置样式?
or, more generally, are there any elements that can't be styled with display:grid
?
考虑:
button,
div {
display: grid;
grid-template-columns: 50px 50px;
}
/* Nevermind these, they're just for a consistent display */
button,
div {
border: 0;
background-color: gray;
color: black;
width: 100px;
text-align: center;
font-family: sans-serif;
font-size: 14px;
padding: 0;
}
Button:
<button>
<span>A</span>
<span>B</span>
</button>
<br>
Div:
<div>
<span>A</span>
<span>B</span>
</div>
这是 Firefox (61.0.1)中的结果:
This is the result in Firefox (61.0.1):
这是 Chrome (68.0.3440.106)中的结果:
And this is the result in Chrome (68.0.3440.106):
Chrome似乎不喜欢我尝试在按钮上使用display:grid
.这只是一个错误吗?还是出于某种目的?
Chrome seems to dislike that I'm trying to use display:grid
on a button. Is this just a bug? Or is it intended somehow?
推荐答案
显然,这是Chrome上的错误,在此处进行了详细说明:
Apparently it's a bug on Chrome which detailed here:
https://github.com/rachelandrew/gridbugs#10-some-html-elements-cant-grid-containers
并在此处跟踪:
https://bugs.chromium.org/p/chromium/issue/detail?id = 375693
这篇关于是< button>允许显示:网格?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!