How to center a popup modal in servicenow portal?

[Raphael Dizon]

Hello,

Any idea on how to center my modal pop up? When my browser is maximized the pop up is located at the right side

But when I minimize my browser to a certain width, it is completely fine and centered.

Kind Regards,

Raphael

[Omkar Mone]

Hi Raphael,

Can you right click on the modal-> Inspect, once it is loaded and check the console or post a screenshot of the same?

[Raphael Dizon]

Hello,

This is the console part:

This is the elements part:

[Kristoffer Mon1]

Notice the "col-sm-6 col-sm-offset-3 ng-scope"?

When you are in full screen, try removing those classes from the inspector. Now I realize this won't actually fix the problem, but it should give you a clue as to why the modal is behaving the way it is. Because it appears your "ng-template" is somehow being infuenced by these bootstrap grid classes.

I also noticed that you have than one bootstrap style sheet. "bootstrap.min.css". You should be okay with ServiceNow's "sp-bootstrap..."

[Raphael Dizon]

Hello,

I just added 'col-sm-6 col-sm-offset-3 ng-scope' to try if it will fix the problem but it didn't do anything so even if i remove it its still the same. How do I remove a bootstrap style sheet?

[Kristoffer Mon1]

Well the reason I was focusing on the classes "col-sm-6 col-sm-offset..." was becsuse I believe this is most likely influencing the behavior of your modal. 

To remove the unneeded boostrap.min.css stylesheet, go to Service Portal > CSS.