Ionic styling Issue

I had applied template styling on ionic button and placed it at the centre of the page,
But when I tried to load that page with router navigation the button gets placed at the bottom of page!!.

This is an Issue.
when i use.

this.router.navigate(['landing'],{relativeTo:this.route});

I want the output to be like this:

i Got this Output with.

this.router.navigate(['/','pages','auth','landing']);

Just want to know How styling works in IONIC, any why this happening? :sweat_smile:
Thanks in Advance :slightly_smiling_face:

You should post your styling code, the HTML and CSS, so we can take a look and see what might be wrong. Routing doesn’t interfere with styling itself.

Maybe you’re not using ViewEncapsulation, which can cause you css to ‘leak’ to other components

Thanks for the advice, here is HTMLand CSS code for them.


and css
image

At a first glance there seems to be no problem with your HTML and CSS. Can you make a little codepen or stackbliz?
Also for your next posts try avoiding posting code as an image, with text we can just copy and paste to test…

1 Like