New issue
Advanced search Search tips

Issue 603160 link

Starred by 2 users
Status: Fixed
Owner:
r...@igalia.com
Closed: Apr 2016
Cc:
jfernan...@igalia.com
r...@igalia.com
svil...@igalia.com
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 3
Type: Bug

Blocking:
issue 79180



Sign in to add a comment

[css-grid] Explicit grid should take into account grid-template-areas value

Project Member Reported by r...@igalia.com, Apr 13 2016 

The definition of the spec is very clear
(https://drafts.csswg.org/css-grid/#grid-definition):
"The size of the explicit grid is determined by the larger
 of the number of rows/columns defined by grid-template-areas
 and the number of rows/columns sized by grid-template-rows/grid-template-columns."

Attached example to reproduce the issue, only using "grid-template-areas" in a grid
makes that auto-positioned items are not placed in the proper columns/rows,
as the grid thinks doesn't have any explicit grid.

Check it live at: http://jsbin.com/rejene/1/edit?html,css,output
explicit-grid-template-areas.html
362 bytes View Download
explicit-grid-template-areas-current.png
1.8 KB View Download
explicit-grid-template-areas-expected.png
1.7 KB View Download
Project Member

Comment 1 by bugdroid1@chromium.org, Apr 14 2016 

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/2b77da3c2afb9ef469d69a52250e7769ae74aca1

commit 2b77da3c2afb9ef469d69a52250e7769ae74aca1
Author: rego <rego@igalia.com>
Date: Thu Apr 14 08:30:48 2016

[css-grid] Use grid-template-areas to determine the explicit grid

From the spec (https://drafts.csswg.org/css-grid/#grid-definition):
"The size of the explicit grid is determined by the larger of the number
 of rows/columns defined by grid-template-areas and the number
 of rows/columns sized by grid-template-rows/grid-template-columns."

So we need to take into account the rows/columns defined by
grid-template-areas to determine the size of the explicit grid.

On top of that this patch is also taking into account this
in LayoutGrid::explicitGridDidResize().

Created a new test to check the right behavior and added new test cases
to check the style changes too.

BUG= 603160 
TEST=fast/css-grid-layout/explicit-grid-size.html

Review URL: https://codereview.chromium.org/1885913002

Cr-Commit-Position: refs/heads/master@{#387261}

[add] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/LayoutTests/fast/css-grid-layout/explicit-grid-size.html
[modify] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-change-explicit-grid-recompute-child-expected.txt
[modify] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-change-explicit-grid-recompute-child.html
[modify] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-template-shorthand-get-set-expected.txt
[modify] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-template-shorthand-get-set.html
[modify] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/Source/core/layout/LayoutGrid.cpp
[modify] https://crrev.com/2b77da3c2afb9ef469d69a52250e7769ae74aca1/third_party/WebKit/Source/core/style/GridPositionsResolver.cpp

Comment 2 by r...@igalia.com, Apr 14 2016

Status: Fixed (was: Assigned)
►

Sign in to add a comment