I’ve a problem on my app with my backgrounds. On my screen when deployed my css property “background-size: cover” won’t work and images are resized like if it was translated to “width:100%; height: 100%”. Any solution ?
My html code :
<ion-content>
<ion-slides autoplay="3000" loop="true" speed="500">
<ion-slide id="slide1">
[...]
</ion-slide>
<ion-slide id="slide2">
[...]
</ion-slide>
</ion-slides>
</ion-content>
My scss code :
page-home {
ion-slides {
ion-slide {
background-size: cover;
background-position: center;
padding-left: 40px;
padding-right: 40px;
min-width: 365px !important;
}
#slide1 {
background-image: url('../assets/img/fond1_opacity50.jpg');
background-position: left;
}
#slide2 {
background-image: url('../assets/img/fond2_opacity50.jpg');
background-position: left;
}
[...]
}
}
On phone vs on browser :