How To - Rounded Corners for Dropdown Controls and labels
Here is a neat little trick for making dropdowns and labels have the same rounded corners that text boxes do.
You will need 3 items to do this.
- Basic Container
- Dropdown or Label
- Text Input
Nest the Dropdown or Label and Text Input inside the container and set the control properties
Dropdown
- Container
- Height: Dropdown.Height + 6
- Width: Dropdown.Width + 5
- Dropdown
- X: 3
- Y: 3
- Border Thickness: 1
- Focused Border Thickness: 1
- Height:
- Width:
- Text Input:
- Text: Blank
- Reorder: Send to Back
- Radius: 5
- Border Thickness: 1
- Height: Dropdown.Height + 2
- Width: Dropdown.Width + 1
- X: Dropdown.X - 1
- Y: Dropdown.Y -1
Label
- Container
- Width: Label.Width + 2
- Height: Label.Height + 2
- Label
- Width: Desired Width
- Height: Desired Height
- Border: None
- X: 1
- Y: 1
- Text Input
- Text: Blank
- Reorder: Send to back
- Radius: 5
- Border Thickness: 2
- Width: Label.Width
- Height: Label.Height
- X: Label.X
- Y: Label.Y
Comments
-
How To - Rounded Corners for Dropdown Controls and labels
One of the best way is to set all borders colors to blank and use HTML text control with proper css.
Looks awesome.Sample CSS
"<div style='background-color: rgba(0,0,0,0); box-shadow: 1px 2px 22px 0px rgba(89,87,87,0.85); margin: 20px; width: 500px; height: 60px; border-radius: 30px'></div>"Sunil Kumar @PowerTrainer @sonuomroutlook
LinkedIn: https://www.linkedin.com/in/powertrainer/
YouTube: https://www.youtube.com/@PowerTrainer -
How To - Rounded Corners for Dropdown Controls and labels
@dawnpeacock, Once you place the text input and dropdown or label inside the container, just so we are on the same page, this is the container I use.
Set the properties on the controls in this order and then see if that makes a difference:
- Dropdown/Label
- Text Input
- Container
-
How To - Rounded Corners for Dropdown Controls and labels
Can't get it to work like yours but will keep tinkering. Thanks for the idea!
-
How To - Rounded Corners for Dropdown Controls and labels
I need help does anyone know why I am getting this "Encountered internal server error. The correlation Id is '0c5bcc51-ba2b-4291-bc88-0f95b7fee0c4" When I try to import into powerapps? I have followed all the steps provided by microsoft.
*This post is locked for comments