Is there a working implementation of CSS3 Grid Layout for Webkit?(是否有适用于 Webkit 的 CSS3 网格布局的有效实现?)
问题描述
<小时>
旧答案:
有一些工作正在进行中,这是其实现的完整问题树:
https://bugs.webkit.org/showdependencytree.cgi?id=60731&hide_resolved=0
这里有一些来自 这个文件:
.gridWithFixed {显示:-webkit-grid;-webkit-grid-columns:7px 11px;-webkit-grid-rows:17px 2px;}
您可以看到意图.不幸的是,他们只能解析 CSS.
所以,现在似乎没有针对 WebKit 的有效实现.
虽然 网格布局 的支持很差,但 Flexbox 有不错的支持(显然,包括 IE10).我建议你改用 Flexbox.
CSS Grid Layout, Editor’s Draft, 21 November 2011
I am in the midst of producing a prototype that will be shown to client on selected devices and browsers. I am not worried about cross-browser compatibility at this time.
IE10 Developer Preview has the following:
display: -ms-grid;
-ms-grid-columns: ;
-ms-grid-rows: ;
-ms-grid-column: ;
-ms-grid-row: ;
-ms-grid-row-align: stretch;
columns: ;
column-fill: auto;
column-gap: ;
Mozilla eludes to having similar to above (I haven’t tested whether it works, yet). However, Webkit appear to have a very different implementation:
display: -webkit-box;
-webkit-columns: ;
-webkit-column-gap: ;
Now, is Webkit using the same specification, or is this for an entirely different model? If it is using the same specification, could you tell me what the syntax is for:
grid-columns: ;
grid-rows: ;
grid-column: ;
grid-row: ;
And, if it is using a different model, could you please let me know what the syntax is and how it differs from MS E10. References will be appreciated.
It is worth noting that I have Google Chrome Canary installed, as well as the latest version of Safari to test the grid on Webkit.
http://caniuse.com/css-grid
As of March 2017, quite a few browsers now support CSS Grid Layout:
old answer:
There's something in the works, here is the full issue tree for it's implementation:
https://bugs.webkit.org/showdependencytree.cgi?id=60731&hide_resolved=0
Here's some CSS from this file:
.gridWithFixed {
display: -webkit-grid;
-webkit-grid-columns: 7px 11px;
-webkit-grid-rows: 17px 2px;
}
You can see the intent. Unfortunately, they've only got as far as parsing the CSS.
So, it looks like right now there's no working implementation of this for WebKit.
While Grid Layout has very poor support, Flexbox has decent support (apparently, including IE10). I suggest you use Flexbox instead.
这篇关于是否有适用于 Webkit 的 CSS3 网格布局的有效实现?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:是否有适用于 Webkit 的 CSS3 网格布局的有效实现?
基础教程推荐
- 直接将值设置为滑块 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01