Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Find everything you need to get certified on Fabric—skills challenges, live sessions, exam prep, role guidance, and more. Get started

Reply
Meeskass
Helper I
Helper I

Page Navigator Padding Issue - The navigator is not the size it should be

Hi!

 

Quick question regarding sizing a page navigator.

My Canvas width is 1500 and my page Navigator width is 1500 (tested out with other width as well).

However there is still a little empty space in between the button and the canvas edge, which is visually annoying

Meeskass_0-1671714124487.png

Meeskass_1-1671714181193.png

The blue background is nicely touching the canvas edge, however the navigator is not. It can be seen that the left side of the navigator is touching the edge, but why not on the right side? The grid padding is 0 and there are no Borders in the navigator nor any other settings. I can't increase the width of the navigator either as it has reached the width of the canvas. 

 

Am I missing a setting somewhere or is this how the navigator buttons work? 😄

 

Further what I realized is when looking at the published report in the APP, then on the left side, the navigator is going over the canvas edge, which should be impossible...

Meeskass_0-1671714465793.png

 

So in the APP, it is over the canvas edge on the left side and not touching the canvas edge on the right side

Meeskass_0-1671714643118.png

 

 

Thanks!

 

4 REPLIES 4
VishalJhaveri
Resolver III
Resolver III

Several possible solutions:
1. Create a blank new page and set its width to 1500. Cut paste the page navigator to the new page, validating its size being 1500 and observe there are any required changes.

2. Create a rectangle shape of the same white color you are using in the Page navigator and turn off its border, shadow and put it on the navigator such that it overlaps and no one can notice the difference between the navigator and the shape.

Thanks for the quick reply!

Tried out both options, however no success:

1) Created a new tab 16:9 size (1280 width), and added the Page Navigator Button (1280 width). But there was still the little empty space on the right side only. 

Meeskass_0-1671716914768.png

 

2) It is a good idea, but my buttons take another color when selected, which means that the white rectangle will be seen when the button on the right is selected 😄

1. If the "Page 1" is selected, you must be navigated to the "Page 1". So for that page, just create the same Rectangle of different color(the one which is selected).

2. Can you try publishing the report on Power BI Service, and check whether the navigator is properly visible or not?

The original colors are like shown below

Meeskass_0-1672215999295.png

If I select the 'How To Use HABIT 2.0' tab, then it turns dark blue just like the background.
I would have to insert a box, that is white when 'How To Use HABIT 2.0' not selected and blue when it is selected. Too much of a hussle in this scenario 😄

And yes, the issue still exists in the Service and in the App. The page navigator goes over the canvas edge on the left side and does not touch the edge on the right side. 

Meeskass_1-1672216188577.png

 


Anyway, I will accept it as a tiny bug in PBI and just leave it there 😄

 

 

Helpful resources

Announcements
July 2024 Power BI Update

Power BI Monthly Update - July 2024

Check out the July 2024 Power BI update to learn about new features.

PBI_Carousel_NL_June

Fabric Community Update - June 2024

Get the latest Fabric updates from Build 2024, key Skills Challenge voucher deadlines, top blogs, forum posts, and product ideas.

Top Solution Authors