[英]css grid layout column
I am trying to create a layout with 5 columns using css grid. 我正在尝试使用CSS网格创建具有5列的布局。 The first and the last columns should have white space.
第一列和最后一列应有空格。
I try to create it but somehow it turns out to be three rows instead of columns. 我尝试创建它,但不知何故它是三行而不是列。
.grid_container{ grid-template-columns: 1fr 2fr 4fr 2fr 1fr; grid-template-areas: ". ABC ." } #column1 { grid-area: A; background:red; padding: 100px; } #column2 { grid-area: B; background:blue; } #column3{ grid-area: C; background: orange; }
I have the 5 columns but the first and the fifth columns should have whitespace. 我有5列,但第一和第五列应该有空格。
You're missing the most important property display: grid
. 您缺少最重要的属性
display: grid
。 The example in CodePen Grid columns . CodePen Grid列中的示例。 Cheers, sigfried.
干杯,sigfried。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.