Adjusting svg fill full width
Hi,
Am trying to design a layout for mobile resolution . The svg I tried doesn't fit to the entire width.
Brief:
CSS:
For desktop
.askingPrice_img {
width: 100%;
max-width: 231px;
height: auto;
background-image: url(../../../assets/img/dashboard/img_SetAskingPrice.svg);
background-repeat: no-repeat;
background-size: contain;
}
for mobile :
@media only screen and (max-device-width: 361px) {
.platform-askingprice-banner {
max-width: 336px;
max-height: 385px;
flex-direction: column;
}
.askingPrice_img {
width: 100%;
min-width: 336px;
min-height: 203px;
}
}
<div class="parent">
<div class="askingPrice_img "></div>
<div class="askingPrice_content"></div>
</div>
Am trying to design a layout for mobile resolution . The svg I tried doesn't fit to the entire width.
Brief:
CSS:
For desktop
.askingPrice_img {
width: 100%;
max-width: 231px;
height: auto;
background-image: url(../../../assets/img/dashboard/img_SetAskingPrice.svg);
background-repeat: no-repeat;
background-size: contain;
}
for mobile :
@media only screen and (max-device-width: 361px) {
.platform-askingprice-banner {
max-width: 336px;
max-height: 385px;
flex-direction: column;
}
.askingPrice_img {
width: 100%;
min-width: 336px;
min-height: 203px;
}
}
<div class="parent">
<div class="askingPrice_img "></div>
<div class="askingPrice_content"></div>
</div>
