Trouble with responsive design using slides

Ionic Framework ionic-v3
#1

I have the following code:

<ion-navbar *navbar>
    <ion-title>Title
    </ion-title>
</ion-navbar>


<ion-content overflow-scroll="true">
        <ion-input type="text"></ion-input>
		<button full>MyButton</button>
		
        <ion-slides loop="true">

            <ion-slide >
                <h2>Header</h2>
				<p>Paragraph</p>
                <img src="mysvg1.svg">
            </ion-slide>

            <ion-slide>
                <h2>Header</h2>
				<p>Paragraph</p>
                <img src="mysvg2.svg">
            </ion-slide>

            <ion-slide>
                <h2>Header</h2>
				<p>Paragraph</p>
                <img src="mysvg3.svg">
            </ion-slide>


        </ion-slides>

</ion-content>

On the top is a navgiation bar. Right under it is an input box and right under the inputbox is a full width button.
Under all this are slides. The problem I am facing is my slides are as the biggest svg. For instance if mysv2.svg is 2000px in height all the slides will be 2000px long even if their images are much smaller and the user has to scroll vertically inside of the slides. I would like to all the slides to fit perfectly in the window with no vertical scrolling. I want the content of the slide to dynamically shrink/expand to the device’s screen size. How can I do this?

#2

Any solutions to this problem. I’m having the same problem, ie. a simple slider with header, question and radio-buttons, and I use percent to set the vertical padding, so it should fit the device accordingly, but the content does not resize to devices. Is it the way that Ionic Slider is built or is there another solution to this problem?