[ionic v4] Ion-slides pagination at top

Hello,
I’m having a problem with the ion-slide pagination, I would it at the top of my page and not at the bottom.
With the doc, I can change the color but not the position on the page.

.html

<ion-slides pager style="padding-bottom: 30px" [options]="slideOpts">
    <ion-slide>
        <p>Page1</p>
    </ion-slide>
    <ion-slide>
       <p>Page2</p>
    </ion-slide>
    <ion-slide>
         <p>Page3</p>
      </ion-slide>
  </ion-slides>

.css

ion-slides {
        --bullet-background: blue;
        --bullet-background-active: darkblue;
    }

.ts

slideOpts = {
    initialSlide: 1,
  };

How to do ?

Thanks

1 Like

styles.css

.swiper-pagination {
   bottom: 66% !important;
}

change padding from bottom to top…

	<ion-slides pager style="padding-top: 30px" [options]="slideOpts">
		<ion-slide>
			<p>Page1</p>
		</ion-slide>
		<ion-slide>
			<p>Page2</p>
		</ion-slide>
		<ion-slide>
			<p>Page3</p>
		</ion-slide>
	</ion-slides>
</ion-content>
3 Likes

Thank’s you. It’s work.