SOLVED

Consistent width buttons on modern page

%3CLINGO-SUB%20id%3D%22lingo-sub-905310%22%20slang%3D%22en-US%22%3EConsistent%20width%20buttons%20on%20modern%20page%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-905310%22%20slang%3D%22en-US%22%3E%3CP%3EWe%20are%20creating%20a%20page%20of%20links%20or%20simple%20actions%20(send%20an%20email%20with%20preconfigured%20content).%20We%20are%20using%20Button%20web%20parts%20but%20all%20the%20buttons%20are%20varying%20lengths%2C%20due%20to%20different%20amounts%20of%20text%20on%20the%20button.%20Is%20there%20any%20way%20to%20make%20the%20buttons%20all%20the%20same%20width%3F%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EPreferable%20in%20the%20box%20solution%2C%20but%20CSS%20if%20that%20is%20the%20only%20way.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks!%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-905310%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3ESharePoint%20Online%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-910521%22%20slang%3D%22en-US%22%3ERe%3A%20Consistent%20width%20buttons%20on%20modern%20page%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-910521%22%20slang%3D%22en-US%22%3E%3CP%3EHi%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F3786%22%20target%3D%22_blank%22%3E%40Rob%20O'Keefe%3C%2FA%3E%2C%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EAs%20far%20as%20I%20know%2C%20there%20are%20no%20options%20%22out%20of%20the%20box%22%20to%20resize%20the%20%22Button%22%20web%20part.%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EYou%20can%20get%20a%20similar%20look%20and%20function%20to%20%22Button%22%20with%20the%20%22Quick%20links%22%20web%20part%20using%20the%20%22Button%22%20layout%20and%20%22Fill%20color%22%20appearance.%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20style%3D%22width%3A%20931px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F137291i81AB1EAA4F92003D%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20alt%3D%22Capture.PNG%22%20title%3D%22Capture.PNG%22%20%2F%3E%3C%2FSPAN%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20style%3D%22width%3A%20335px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F137292i7D63179BADF1B997%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20alt%3D%22Capture1.PNG%22%20title%3D%22Capture1.PNG%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3EI%20hope%20this%20helps.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ENorm%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-911204%22%20slang%3D%22en-US%22%3ERe%3A%20Consistent%20width%20buttons%20on%20modern%20page%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-911204%22%20slang%3D%22en-US%22%3EYes%2C%20i%20forgot%20about%20that%20Quick%20Link%20styling%2C%20i%20think%20that%20might%20work%20in%20this%20case....%3C%2FLINGO-BODY%3E
Highlighted
Super Contributor

We are creating a page of links or simple actions (send an email with preconfigured content). We are using Button web parts but all the buttons are varying lengths, due to different amounts of text on the button. Is there any way to make the buttons all the same width?

 

Preferable in the box solution, but CSS if that is the only way.

 

Thanks!

2 Replies
Highlighted
Best Response confirmed by Rob O'Keefe (Super Contributor)
Solution

Hi @Rob O'Keefe,

 

As far as I know, there are no options "out of the box" to resize the "Button" web part. 

 

You can get a similar look and function to "Button" with the "Quick links" web part using the "Button" layout and "Fill color" appearance.

Capture.PNGCapture1.PNG

I hope this helps.

 

Norm

Highlighted
Yes, i forgot about that Quick Link styling, i think that might work in this case....