Another way to set website features instead of CSS Hero?

I find CSS Hero amazing to use in terms of ease and “no brainer,” but I feel like I have lost control of my website. When I set the height of an area on my home page (Employees) using CSS Hero, it broke my website and I had to do some repairs. How do you even know the name of the boxes on your page in order to name them and manually set CSS, for instance, the size of the “frame” that holds the employee boxes on several rows, or the border size and color around each of those individual employee boxes?? This is what is so confusing to me – there is no real roadmap or set of commands, or is there?
Thanks for any responses.

Hello there,

T do manual CSS, you need to get the ID or class selectors of particular element, you can use the web browser’s inspector tool. Then manually write your CSS code to your site’s Additional CSS under the customizer panel. Or, you can use child theme’s stylesheet. For more detailed instructions, please check out this article.

Regards,
Kharis

Thank you, that is good information. Is there an html list for writing css codes? I mean, I know what certain things mean when reading css but I’m just wondering if there is some master list somewhere? For instance, if you want something to work both on the pc and iPhone (and ipad, etc), I’m not sure how to do that – when I start encoding I feel like I break the responsiveness.

You’re welcome! :slight_smile:

You’ll need CSS media query to target specific styles on certain device screen (based on screen width). Here are some reading list for you:

Regards,
Kharis