为什么我的CSS网格不能在Chrome中使用(在所有其他浏览器中都可以使用) [英] Why is my css grid not working in Chrome (works in all other browsers)
问题描述
我已经设置了一个3列的CSS网格来显示我们的投资组合.我找到了适用于Firefox和Internet Explorer和Safari的代码.但是在Chrome上它根本不显示我的网格,所有图片都在彼此下方.请访问以下网站: http://www.ddw-sanitair.be
I've setup a css grid with 3 columns to display our portfolio. I found a working code for Firefox and Internet Explorer and Safari. However on Chrome it doesn't show my grid at all, all the pictures are below each other. See the website: http://www.ddw-sanitair.be
此外,它在某些图片上不接受'display:none'类,因此是双重/三重图像...
Additionally it does not accept the 'display: none' class on some of the pictures, hence the double/triple images ...
有什么建议吗?
我试图添加grid-auto-rows:270px;如另一个线程中所建议.我尝试添加grid-template-rows:repeat(3,1fr);如另一个主题中所建议.
I tried to add grid-auto-rows: 270px; as suggested in another thread. I tried adding grid-template-rows: repeat(3, 1fr); as suggested in another thread.
但这并没有改变Chrome中的任何内容...
But this didn't change anything in Chrome ...
.portfolio-group {
position: relative;
display:grid;
align-items: start;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
grid-auto-rows: 270px;
预期结果=一个漂亮的反应性网格,具有3列3行(在浏览器视图中).
Expected result = a nice reactive grid with 3 columns and 3 rows (in browser view).
推荐答案
i hope you will get the ans from this site: `https://rachelandrew.co.uk/archives/2014/06/27/css-grid-layout-getting-to-grips-with-the-chrome-implementation/
这篇关于为什么我的CSS网格不能在Chrome中使用(在所有其他浏览器中都可以使用)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!