How to Reposition DisplayMessageBox buttons:
When using the DisplayMessageBox component the buttons by default are on the bottom right of the message box.
In some instances, the requirement might be to have the buttons centered or to the left of the message box or to have the message box display a little smaller.
See the below steps to change the button positioning:
- Enable the solutions style sheet by clicking on the solution name in the application explorer and then checking the Enable Style Sheet option under application properties
- In the CSS Style Sheet add the following class: .modal-footer
- In the class add the following rule: text-align: left; (or center)
- Preview the application to see the changes
See the below steps to change the message box size:
- In the CSS Style Sheet add the following class: .modal-dialog
- In the class add the following rule: width: 20%; (or any specific size)
- Preview the application to see the changes
Please see the attached solution used in screenshots.
DisplayMessageBoxButtons.sapz (5.3 KB)
There are a lot more rules to play around with, hopefully, this provides a starting point.
Have fun!