Once I start to place elements on the grid. Where can I see that CSS code? I do not see it on style.css.
You have to add classes using the tree page structure and then save the inline style to a proper css rule using the CSS tyle panel.
Otherwise it will not write the css on a stylesheet but as inline style in the html.
1 Like
And this might help a bit more too.
When you create the grid (or ANY STYLING) in Pinegrow… the styles are save to an INLINE STYLE IN THE WEB PAGE -until. you actually save the styles IN AN EXTERNAL Style sheet.
where is the styling for the CSS Grid outline you can see?
Well, it is saved here, in the. web page itself as an INLINE style.
So use Visual grid tool to create a grid, then Click on the GRID ELEMENT in page view, and it’s
CSS STYLE Will appear in the STYLE panelTab, under Active Tab view.
You can then move this style to the external style sheet.
so to do this! -basically, hover the mouse over the + sign Ito the right of the styling
and it will present a pop up that says
move inline style to a proper CSS Rule
YAY! do that.
Give it a name with a . in front of it for a class and you will then see that inline style has gone from the body and is now in style.css
1 Like
Ah, thanks. schpengle, your method of annotating your answers very much serves my need for visual learning!
1 Like
Hi, @jtkay your welcome, very glad it was helpful. 
@red-rosefields answer was fine, but I too am mostly a visual/kinesthetic learner but when i followed those instructions, I realised I needed visuals! So! Thought I would create them!
oh the joy of VARK!
Also, I really should have included the link to @matjaz 's (the Pinegrow Author) excellent, youtube CSS Grid course. Stupid of me to have omitted that, but it was late and I was tired
so here you go,
on the Main Pinegrow Documentation site
or on Youtube
and then check out his summer nights tutorial on that channel too and basically, watch EVERYTHING by him!!
Its all shown very well explained excelletnly I find.
1 Like
i would add, that in the case of inline styling on the -body-, as is shown by schpengle’s example, you don’t need to invent a .class name, you can simply add it to the CSS rule for -body-
body {
grid:display;
yada…yada;
}
inventing .class names is hard… don’t do it if you don’t have to.
1 Like