This code work correctly except the uploaded image I want it to have a specific width & height even if the image is large or small , the size should be the same for all of them .
What can I do for this? ==> CSS
.StyleHeader{
color: white;
background-color: white;
}
.titlePosition2{
color: red;
font-size: 160%;
margin-top: -12%;
margin-left: 8%;
}
.slds-page-header{
background-color: white;
}
.styleStatut{
margin-top: 0.5%;
margin-left: -5%;
}
.position1{
color: black;
font-size: 160%;
margin-top: -12%;
margin-left: 8%;
/* position: absolute; */
}
.StyleAdress{
color: rgba(0, 153, 255, 0.973);
font-size: 120%;
margin-top: 15%;
}
HTML :
<template>
<lightning-card>
<div class="slds-page-header">
<div class="slds-page-header__row">
<template if:true={MyObject.data}>
<div class="slds-grid slds-gutters">
<div class="slds-col ">
<span>
<span class="slds-m-around_medium styleStatut">
<img style=" width: 40%;
margin-top: 12%; " src={statut_icon} >
</span>
</span>
</div>
<div class="slds-col">
<div><br>
<div class="position1">
<div>
<h1><strong>{Name}</strong></h1>
</div><br><br></div>
<div class="position1">
<div>
<h1><strong>{Formula__c}</strong></h1>
</div><br><br></div>
<div class="titlePosition2">
<div>
<h1><strong>{Type__c}</strong></h1>
</div>
</div>
</div>
</div>
<div class="slds-col">
<span>
<lightning-spinner if:true={isLoading} alternative-text="Loading" size="small"> </lightning-spinner>
<template if:true={imageurl}>
<img src={imageurl} style="
width: 140%;
height: 100%;
"/>
</template>
</span>
</div>
<div class="slds-col">
<span>
<div style="margin-top: 70%; " >
<lightning-file-upload name="fileUploader" accept={acceptedFormats} record-id={recordId} onuploadfinished={handleUploadFinished} onchange={saveFile} disabled={disableImport}>
</lightning-file-upload>
</div>
<div>
<template if:true={fileName}>
{fileName}
</template>
</div>
</span>
</div>
<div class="slds-col">
<span style="height: 50%; width: 50% ">
<lightning-map
map-markers={mapMarkers}
zoom-level={zoomLevel}
center={center}
onmarkerselect={handleMarkerSelect}
selected-marker-value={selectedMarkerValue}
>
</lightning-map>
</span>
</div>
<div class="slds-col">
<span>
<div class="StyleAdress">
<p >{Country}</p><br>
<p>{City}</p><br>
<p>{Street}</p>
</div>
</span>
</div>
</div>
</template>
</div>
</div>
</lightning-card>
</template>
