I'm putting together a list that has an image and seto its size on the same line as the code below.
<tr>
<th>
<img src="images/radio1.jpg" width="48px" , height="48px" />
</th>
<th>Tradição AM</th>
<th>11.750.246/0001-05</th>
</tr>
I want to create a class within a <th> to set width and heigth to my css worksheet to make the job easier. It is possible? If not, how else can I achieve a similar result?
The syntax of your HTML is wrong:
essa vírgula não deveria existir
↓
<img src="images/radio1.jpg" width="48px" , height="48px" />
↑ ↑
esses valores devem ser numéricos, e não aceitam px
The correct one would be:
<img src="images/radio1.jpg" width="48" height="48" />
If you want to size the image via CSS, change the element to:
<img src="images/radio1.jpg" />
And put it in your CSS:
th img{ /* seleciona img dentro do th */
width: 48px;
height: 48px
}
You can add a class in th also:
<tr>
<th class="lista">
<img src="images/radio1.jpg" width="48px" , height="48px" />
</th>
<th>Tradição AM</th>
<th>11.750.246/0001-05</th>
</tr>
Then change the selector too:
th.lista img{ /* seleciona img dentro do th */
width: 48px;
height: 48px
}
Example:
th.lista img{
width: 48px;
height: 48px
}<table>
<tr>
<th class="lista">
<img src="https://www.cleverfiles.com/howto/wp-content/uploads/2016/08/mini.jpg" />
</th>
<th>Tradição AM</th>
<th>11.750.246/0001-05</th>
</tr>
</table>Here's an example below.
In your .html file put it like this, remembering that it is not recommended to use the style inside the html, but directly through the css.
<style>
.classth1{width:50%};
.classth2{color:green};
.classth3{color:blue};
<style>
<tr>
<th class="classth1">
<img src="images/radio1.jpg" width="48px" , height="48px" />
</th>
<th class="classth2">Tradição AM</th>
<th class="classth3">11.750.246/0001-05</th>
</tr>