Editing existing CSS Classes

Hi all,

I am attemtping to edit exting Classes and CSS in Pinegrow on a premade Homepage Template.

When I open the homepage, index.html, Pinegrow displays the html code as expected along with all the Classes that exist within the html code.

For Example:

Your captivating caption...

What I need to know is how to open the CSS Page or locating the page and the Classes by simply clicking on the Class.

Say I wanted to edit the Class sliderimages.

  • How would I find and get to the CSS in order to edit the properties?

Hey, You can just open your css-file like style.css in Pinegrow. Open it just like you did with index.html. When you then click on a class in the style tab, Pinegrow jumps to that class in the css code.

Adding on to @Riccarcharias, if you select the element in question, the Styles panel will show all the classes which apply to it. Choosing the desired selector, you can make changes there or click on the </> icon to show the code (plus other options).

To find the file itself, note which css file is being referred to in the Styles panel, then go to the Stylesheets dropdown (v) and then the Add & Manage button. That will display a list of active stylesheets, along with the file path.

Unfortunately, Pinegrow doesn’t interact with the file system very well, so options like Open in Finder (or whatever the Windows equivalent is) isn’t available.

Hopefully I’ve address your question. I know how instinctive it is to offer what we know, rather than what the OP asked. Apologies in advance if I’ve misinterpreted your post.

1 Like