Shape title and body misaligned

[TRADER083]

Hi everyone,

I created a shape with a title to act as visual section for my filters. When I added a Visual Border (with rounded corners), it appears that the body section is indended (see red box below). Is this a bug or intended interaction?

Edit: Looks like the issue is resolved after upgrading from Oct to Nov release somehow.

Before fix:

After fix

After fix:

Before fix

[TheoC]

Hi @TRADER083 

I may be misunderstanding the scenario, however, if you are adding a border to the Shape, you need to replicate the same process for the Slicer / Filter.  Reasonbeing, even if you have them perfectly aligned, by adding a 1px border to one will create a misplacement with the other.

Hope that makes sense?

Theo 🙂

[TRADER083 · Accepted solution]

Thank you for your response. The slicer is much smaller (just the light gray area in the middle) in the picture above and does not overlap with the border of the shape. The shape itself is creating the issue somehow (and only affecting the left side).

[TheoC]

@TRADER083 my apologies, I enlarged the image 500% and now see what you are referring to.  I'd be confident in saying that is a glitch and should be flagged with the PBI team.   I was able to recreate the glitch by doing exactly the same thing.  I also realised that the shape visual has two different places where a Border can be "rounded" and if you use the rounding in Shape menu, it doesn't change the border of the title. However, if you go to General menu and adjust rounding there, it does it to the entire shape including Title.  

Unfortunately, this is certainly a glitch and some things that the PBI team will need to work on to get right.

Great pick up by the way.  

A workaround to your issue might be to:

1. Create the shape with the rounding as you want, and make it the colour you want your title background (i.e. in below I used dark blue). 
2. Copy and paste the shape, and then select the new shape and make it the colour you want at its face (i.e. in below i used light blue). Centre it ontop of the first shape, slightly offsetting it to make it look like the first shape is the border.
3. Select the second shape at the corner bottom corner while holding SHIFT. Slightly shrink it to fit into the first shape and create the border-like effect). Then click at the centre top border, reducing the height enough to add a text box. 
4. Create a Text box to write the Title. Turn off the background, then centre above.

I know it's not ideal but I hope this helps!

Theo