pagina non risponde al CSS

[chiappesonore]

Ciao a tutti,
ho creato questa classe per le tabelle:

.photo table {  border-collapse: collapse;  border: 1px solid black;}
.photo td {  background-color: #4CAA50;  color: white;}
.photo img{  max-width: 100%;  height: auto;}

e l'ho richiamato cosi' sulla pagina su wordpress:

<table class="photo">  <tr>    <td><img src="/wp-content/uploads/2019/12/HK%20HC%20sunset.jpg" alt="Ferry dock" width="700"></td>    <td>View from China (香港中港城碼頭) Hong Kong china ferry terminal. With over 2.1 million people living in an area of less than 47 km², Kowloon is one of the most densely populated places on the planet. (11.19)</td>  </tr>  <tr>    <td><img src="/wp-content/uploads/2019/09/Croce%20Rossa/AlbaI.jpg" alt="Alba da Croce Rossa" width="700"></td>    <td>Just above Cibrario refuge in Val di Viu'. The name derives from the particular red cross painted on the slope that glimpsed at times, looking up from the Cibrario refuge. (10.19)</td>  </tr>  <tr>    <td>Jill</td>    <td>Smith</td>  </tr>  <tr>    <td>Eve</td>    <td>Jackson</td>  </tr>  <tr>    <td>Jill</td>    <td>Smith</td>  </tr>  <tr>    <td>Eve</td>    <td>Jackson</td>  </tr>  <tr>    <td>Jill</td>    <td>Smith</td>  </tr>  <tr>    <td>Eve</td>    <td>Jackson</td>  </tr></table>

Ora se vado alla pagina noto che nessuna formattazione e' ricevuta.
Non riesco a capire il mio errore, mi potete dare una mano?

[KillerWorm]

Ciao, la classe .photo è sull'elemento table per cui il selettore CSS andrebbe impostato in questo modo:

table.photo { ... }

Gli altri due potrebbero essere anche giusti e su quelli dovresti comunque vedere la formattazione.

[chiappesonore]

Si, e' corretto come dici.
Perche' gli altri 2 andavano gia' bene come erano? ci sono modi migliori di scriverli?

[KillerWorm]

Perche' gli altri 2 andavano gia' bene come erano? ci sono modi migliori di scriverli?

Perché tra il "selettore classe" e il "selettore elemento" hai usato il combinatore "selettore discendente" che trova corrispondenza con quegli elementi.

Il modo migliore di costruire i selettori è quello di usare una sintassi pulita e adatta a selezionare gli elementi desiderati, secondo i vari eventuali fattori del caso. Non ci sono metodi specifici per farlo ma chiaramente questo lo si può fare al meglio se si conoscono bene le regole di base.

La costruzione dei selettori CSS infatti si basa su regole precise; sono comunque nozioni fondamentali, che deduco ti manchino. L'argomento è troppo generico per poterlo esporre in questa discussione, sarebbe troppo dispendioso e comunque inopportuno. Ti consiglio eventualmente di studiare qualche guida di base per comprendere questi meccanismi.

Vedi questa: I selettori CSS su HTML.it
o altre guide che puoi trovare al capitolo 1 dei link utili CSS o con opportune ricerche sul web

[chiappesonore]

Grazie mille. Mi metto sotto a studiarli.