Help wanted for "Test your skills: Grid Layout"

This is a task:“

It has a supplementary question under this task:" Can you now cause the first item to display on top without changing the order of items in the source?"

.grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: 100px 100px 100px;
gap: 10px;
.item1 {
grid-column: 1/4;
grid-row: 1/3; ​

.item2 {
​grid-column: 2/5;
​grid-row: 2/4;

I don’t know.Can you help me?

Hello @zhao19940701

what about using this :wink:

it would be better if you post your code on any online service in your future post

hope that help and have a nice day :slight_smile:


Especially for grids an flexboxes there is also:

This is also a possibility to solve the supplementary question.



Thank you. Good luck :grinning:

you welcome and thanks you too :slight_smile:

        Thank you.Good luck!Michael.
1 Like

.item1 {
grid-column: 1/4;
grid-row: 1/3;
order: 1