Stop the modal snapping at a certain width?


Hey, me again i’m afraid. Just wondering how I can get the modal to stop snapping at a certain width? Really annooying me! For example;
Looks fine here -
And then you make the width too small -
and it just goes crazy.

Any help is appreciated, thank you.


Well the modal adjust it’s self with this css on bigger devices.

.modal {
position: absolute;
top: 0;
z-index: 10;
overflow: hidden;
min-height: 100%;
width: 100%;
background-color: #fff;

@media (min-width: 680px)
.modal {
top: 20%;
right: 20%;
bottom: 20%;
left: 20%;
overflow: visible;
min-height: 240px;
width: 60%;

So this is what you need to edit to fix this


It’s better to fix using Sass parameters (in _variables.scss) to simplify upgrades.


True, but with the scss file being updates with new versions of ionic, its good to keep overrides separate from the ionic source.