Okay, after my first attempt to build a page starting with a grid structure (before putting content in the ) failed, I would like to try something else: Create a grid for a on a page with 5 div elements. I tried selecting the divs in the code but cannot find a way to then create a grid.
I’d appreciate some advice.
Did you saw / read / watch the documentation and tutorial about CSS Grid…
They are a great resource and guidance!
Good luck and have fun!
Yes I did, but it did not help any further. So might just continue handcoding.
Short guidance :
Create a “container”, put 5 “divs” inside the container.
Select the “container” and define a grid layout.
The “divs” will be placed on the grid from where you can drag them and re-arange them with the visual controls, to the section(s) you want.
Ahh … my mistake: I only selected the divs inside the container. Thanks Marf … Ok, I’ll continue playing now (although handcoding took me about 3 minutes or so - but if it comes to bigger projects I’d appreciate a “grid-maker”.
Thanks a lot.
Yes, well I’d be happy if there was a major text-documentation. I see a ton of videos and a few text sections, which are very good, but for looking up stuff in text … okay, that may be just me.
Anyway, thanks again for your help. I retried with Pinegrow and got the grid done.
Section “Creating the grid” the first sentence is…
The CSS grid layout is defined on the container element.
Directly followed by :
Let’s say we have a div with a heading, image, tagline and a block of text.
To arrange those elements into a grid, we create the grid on the parent div element by selecting it and clicking on the Edit grid icon or pressing CMD+G_KEY (CTRL_KEY on Windows and Linux) shortcut.
(Not hard to find. But no problem, we all can make mistakes)
don’t you generally want to do this on the BODY so you can use grid to control all parts of the page, instead of using DIV?