Given the following code, how can I make all image the same size (as the smallest one?)
Searched MDN and other ressources, but failed to do it.
On the file system, all icons are the same size:
$ file *
github.com.ico: MS Windows icon resource - 2 icons, 16x16, 32 bits/pixel, 32x32, 32 bits/pixel
joinmastodon.org.ico: MS Windows icon resource - 3 icons, 16x16, 32 bits/pixel, 32x32, 32 bits/pixel
stackoverflow.com.ico: MS Windows icon resource - 2 icons, 16x16, 32 bits/pixel, 32x32, 32 bits/pixel
www.linkedin.com.ico: MS Windows icon resource - 1 icon, 16x16, 32 bits/pixel
www.malt.com.ico: MS Windows icon resource - 3 icons, 16x16, 32 bits/pixel, 16x16, 32 bits/pixel
www.malt.fr.ico: PNG image data, 16 x 16, 8-bit colormap, non-interlaced
www.upwork.com.ico: MS Windows icon resource - 3 icons, 16x16, 32 bits/pixel, 16x16, 32 bits/pixel
.ico {
size: 15px;
} <ul class="ico">
<li><img alt="github" src="https://sputnick.fr/icons/github.com.ico"><a href="https://github.com/" rel="nofollow noreferrer">Github</a></li>
<li><img alt="Malt" src="https://sputnick.fr/icons/www.malt.fr.ico"><a href="https://www.malt.fr" rel="nofollow noreferrer">Malt</a></li>
<li><img alt="Upwork" src="https://sputnick.fr/icons/www.upwork.com.ico"><a href="https://www.upwork.com/" rel="nofollow noreferrer">Upwork</a></li>
<li><img alt="LinkedIn" src="https://sputnick.fr/icons/www.linkedin.com.ico"><a href="https://www.linkedin.com//" target="_blank">LinkedIn</a></li>
<li><img alt="Stackoverflow" src="https://sputnick.fr/icons/stackoverflow.com.ico"><a href="https://stackexchange.com/users/212394/gilles-qu%c3%a9not?tab=accounts" target="_blank">Stackoverflow</a></li>
<li><img alt="Mastodon" src="https://sputnick.fr/icons/joinmastodon.org.ico"><a href="https://mamot.fr/" rel="me nofollow noreferrer">Mastodon</a></li>
</ul>>Solution :
Add to yours code CSS / style:
.ico>li>img{
width:22px;
height:22px;
margin-right:10px;
}<ul class="ico">
<li><img alt="github" src="https://sputnick.fr/icons/github.com.ico"><a href="https://github.com/" rel="nofollow noreferrer">Github</a></li>
<li><img alt="Malt" src="https://sputnick.fr/icons/www.malt.fr.ico"><a href="https://www.malt.fr" rel="nofollow noreferrer">Malt</a></li>
<li><img alt="Upwork" src="https://sputnick.fr/icons/www.upwork.com.ico"><a href="https://www.upwork.com/" rel="nofollow noreferrer">Upwork</a></li>
<li><img alt="LinkedIn" src="https://sputnick.fr/icons/www.linkedin.com.ico"><a href="https://www.linkedin.com//" target="_blank">LinkedIn</a></li>
<li><img alt="Stackoverflow" src="https://sputnick.fr/icons/stackoverflow.com.ico"><a href="https://stackexchange.com/users/212394/gilles-qu%c3%a9not?tab=accounts" target="_blank">Stackoverflow</a></li>
<li><img alt="Mastodon" src="https://sputnick.fr/icons/joinmastodon.org.ico"><a href="https://mamot.fr/" rel="me nofollow noreferrer">Mastodon</a></li>
</ul>