I've tried calling the id in css and changing it with important and other options and I've come to not be able to figure out how to make it work.
https://jsfiddle.net/6p0wmpr1/
div {
border-radius: 5px;
background-color: #f2f2f2;
padding: 25px;
}
.dialog{
padding:0px !important;
}
<div hidden class="dialog" id="dialog-message" title="Download complete">
<p>
<span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
Your files have downloaded successfully into the My Downloads folder.
</p>
<p>
Currently using <b>36% of your storage space</b>.
</p>
</div>
It's not padding. Its "helper" divs added when you create the modal dialog. Add this to your css:
.ui-resizable-handle
{
display:none !important
}
If the gray box around your ok button bothers you (Because it bothers me), you can fix that with this:
.ui-dialog-buttonset
{
background: white
}