Forum Discussion

0Experience's avatar
0Experience
Helper III
1 year ago
Solved

Slicer Input Boxes Overlapping Outer Border

Hi,

 

I have a slicer with two input boxes to manually type in year values (e.g., 2018 and 2023). The outer border of the slicer looks fine, but the inner input boxes are slightly overflowing or getting cut off by the outer border, which affects the visual alignment.

 

I need to keep the outer box size unchanged to maintain consistency with a card visual placed on the right side.

 

However, I’d like to reduce the height and width of the inner input boxes so they fit neatly within the outer border without overlapping. I am not interested to increase the size of the slicer or card visuals. Or decrese the font size of the slicer, as, I need to keep same font size for the slicer and card visuals.

 

Power bi file can be accessed from here. Any tips or suggestions would be greatly appreciated!

 

Thanks in advance!

Need Help
Show and Tell
Tips and Tricks
  • Bmejia's avatar
    Bmejia
    1 year ago

    Hi,
    I don't believe this will be possible without you changing the font size or expanding the fields.  If you can't expanded or change font cause of  workspace available.  You can always expand the page size so you can have a bit more room.


9 Replies

  • Bmejia's avatar
    Bmejia
    Super User
    1 year ago

    Hi,
    I don't believe this will be possible without you changing the font size or expanding the fields.  If you can't expanded or change font cause of  workspace available.  You can always expand the page size so you can have a bit more room.


  • Aburar_123's avatar
    Aburar_123
    Solution Supplier
    1 year ago

    Hi 0Experience ,

     

    You have to either increase the hight of the slicer visual or decrease the font size.

     

    Thanks,

  • v-kpoloju-msft's avatar
    v-kpoloju-msft
    Community Support
    1 year ago

    Hi 0Experience,

    Thank you for reaching out to the Microsoft fabric community forum. Also, thanks to Aburar_123 , Bmejia, for his inputs on this threa

    Add inner padding to the slicer container. This keeps the outer border and the visual’s width/height unchanged but nudges the input boxes inward.

    Select the slicer then open format pane → General → Properties → Padding. Set something like:

    • Left: 6–10 px
    • Right: 6–10 px
    • Top: 2–6 px
    • Bottom: 2–6 px

    Leave Values > Text size as-is (so it still matches the card). Keep Effects > Border and the visual Width/Height unchanged.

    The outer border stays the same size, but the two input boxes now sit comfortably inside it (no overlap/clipping), and the font matches your card.

     

    Hope this helps clarify things and let me know what you find after giving these steps a try happy to help you investigate this further.

    Thank you for using the Microsoft Fabric Community Forum.

    • 0Experience's avatar
      0Experience
      Helper III
      1 year ago

      v-kpoloju-msft thank you for your detailed answer. Really appreciate it.

       

      However, I tried multiple padding combination from your suggestions, but doesn't seems to work.

       

      Would you mind to share your screenshot that shows two input boxes now sit comfortably inside the outer box?

       

      My screenshot is 

       

       

      • v-kpoloju-msft's avatar
        v-kpoloju-msft
        Community Support
        1 year ago

        Hi 0Experience,

        Thanks for testing out the padding options and for sharing your screenshot that is very helpful.

        Currently, in the standard “Between” slicer, the Padding setting only adjusts spacing between internal elements (like text vs. labels), but it does not resize or inset the input boxes themselves. This is why the input fields are still touching the slicer border in your screenshot. Here are several options mentioned below, please look those:

        Button Slicer: Try using the newer Button Slicer visual. This visual has a dedicated Padding option under Format > Buttons > Padding, which gives you more control to inset content properly inside the border.

        Shape Overlay: Keep your current slicer as-is. Turn off the slicer’s border (Format > Effects > Border = Off). Insert a Rectangle Shape with outline only (no fill), size it to your desired outer dimensions, and place the slicer inside it with a small margin. Group both elements together. This gives a visually identical effect to your “expected” screenshot, with full control of spacing. https://community.fabric.microsoft.com/t5/Desktop/Decrease-padding-in-slicer/td-p/2765126

        Refer this link: https://learn.microsoft.com/en-in/power-bi/visuals/power-bi-visualization-slicers?tabs=powerbi-desktop

        Hope this helps clarify things and let me know what you find after giving these steps a try happy to help you investigate this further.

        Thank you for using the Microsoft Fabric Community Forum.