Ti ringrazio per la risposta e ti faccio i complimenti perchè mi hai dato tanti spunti di riflessione, a partire dal modo in cui hai impostato la larghezza dei box-cd-cover e della proprietà box-sizing: border-box che sinceramente non conoscevo.
La cosa che mi resta ostica da assimilare e il modo incui si combinano i selettori per esempio il pseudo elemento hover.
Non c'è di che. Se intendi approfondire lo studio posso consigliarti di dare uno sguardo tra i link utili (discussione in evidenza), dove puoi trovare molti riferimenti a guide, manuali e altre risorse interessanti.

L'altra riga di codice che non ho capito è dove utilizzi:
codice:
.box-cd-cover:not(:first-child)
Il selettore :not() esclude qualcosa. In questo caso ho escluso il primo elemento figlio.
Di fatto viene attribuito un margine sinistro ai vari elementi .box-cd-cover, tranne che al primo, perché in questo caso mi interessava inserire uno spazio (margine) solo tra un elemento è l'altro escludendo quindi eventuali margini più esterni.

Questo è un sistema ma chiaramente, come già indicato, si può risolvere in vari modi.

honotatoche si procede dall'alto verso il basso ma non è possibile fare il viceversa ovvero tornando al codice scritto da te ho apportato le seguenti modifiche:...

Sbaglio qualcosa oppure èunlimite dei CSS?
Sì, è un limite. Più precisamente è una caratteristica peculiare dei CSS. Per questo motivo si chiamano "Cascading Style Sheets" (fogli di stile a cascata). Non è possibile andare a ritroso nella cascata. In alcuni casi è possibile superare questi "limiti" studiando al meglio una soluzione css o usando particolari stratagemmi. Là dove non sia possibile superare questi limiti col solo css, solitamente si ricorre all'uso di JavaScript.

Ad ogni modo bisognerebbe capire quale sia il risultato che vorresti ottenere.