CSS in child themes

[MightyMouseofGod]

In a solved question posted by jmm.it on 23rd April 2020, part of the solution is to

- add new stylesheet in child theme theme.yml, with custom name (child_custom.css) and 999 priority

I have created the folder structure for a child theme and created a css file but  I don't understand how to do this step.

The prestashop documentation explains how to modify a template but not the css.

Thanks

[MightyMouseofGod]

I've researched a bit more and found out about including assets so now I have

in /home/soocoolco/public_html/test/themes/MyChildTheme/config/theme.yml

parent: apparelpro
name: MyChildTheme
display_name: Deb's test child Theme
version: 1.1.0
assets:
use_parent_assets: true

css:
    all:
      - id: custom-lib-style
        path: assets/css/child_custom.css
        priority: 999

 

in /home/soocoolco/public_html/test/themes/MyChildTheme/assets/css/child_custom.css

.offer-block .img-block {
    padding: 15px;
}

page http://www.soocool.co.uk/test/

the purple squares which will eventually link to category pages have

<div class="img-block left-block">
<a href="#"> <img src="http://www.soocool.co.uk/test/img/cms/Multi.jpg" alt="Multicoloured"></a></div>

and on inspection they have

.offer-block .img-block {
    display: inline-block:
    float: left;
    width: 33.333%;
     padding: 0 15px;
     }

I'm a novice with css and inheritance and a complete newcomer to prestashop and yml files. can anyone see what I've done wrong or point me at some documentation that might explain it.

Thanks

Edited June 29, 2021 by MightyMouseofGod
pressed return accidentally before finishing! (see edit history)