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
Sept PBI Carousel

Power BI Monthly Update - September 2024

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

September Hackathon Carousel

Microsoft Fabric & AI Learning Hackathon

Learn from experts, get hands-on experience, and win awesome prizes.

Sept NL Carousel

Fabric Community Update - September 2024

Find out what's new and trending in the Fabric Community.

Top Solution Authors
Top Kudoed Authors