My class called cbImage has a fixed CSS for all images.
.cbImage img {
width: 100%;
height: 100%;
}However, I don't want all images to have the same width and height.
Is there a way to change the width and height of different images as needed?
For example, one image in a panel:
<div class="cbImage w3">
<div class="panel">
<div class="form">
<div class="login">Recent badges</div>
<span class="fa-stack fa-5x has-badge" data-count="6">
<div class="badgesize">
<img src="images/7.png" width=100, height=100 alt="">
</div>
</span>
</div>And another image:
<div class="cbImage active signin agileits">
<form >
<figure class="snip1336">
<img src="images\44.jpg" alt="sample87" />
<figcaption>
<img src="images\ownpic.jpg" alt="profile-sample4" class="profile" />Both classes have the name cbImage, causing the size to be fixed.
I need the images of both classes to have different sizes.
However, changing the name and adjusting the width and height is not a viable option due to other existing CSS.
Any assistance would be greatly appreciated.