I have a blue footer like this
<ion-footer align="center">
<ion-toolbar>
<ion-title>
...
But it is showing a shadow style border at the top. How can I remove it. I tried to inspect it but did not find anything.
In ionic 2/3 border will be removed by using ionic-header no-border. In ionic 5 border will be removed by using class="ion-no-border". .bar-header { border: 0px !important; border-bottom-color: transparent !important; background-image: none !important; border-bottom: none !important; }
To have a transparent header or footer you have to override the class "scroll content" in the ion-content and set the margin-top or margin-bottom to 0. Thanks for contributing an answer to Stack Overflow!
Footer is a root component of a page that sits at the bottom of the page. Footer can be a wrapper for ion-toolbar to make sure the content area is sized correctly.
Footer is a root component of a page that sits at the bottom of the page. Footer can be a wrapper for ion-toolbar to make sure the content area is sized correctly. import React from 'react'; import { IonContent, IonFooter, IonToolbar, IonTitle } from '@ionic/react'; export const FooterExample: React.
In ionic 5 the built in class is slightly different I came across this recently and decided to post an update.
<ion-footer class="ion-no-border">
<ion-toolbar>
<ion-title>
fsdfda
</ion-title>
</ion-toolbar>
</ion-footer>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With