Im trying to prevent the dialog box from jquery from having padding

Question

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>

Answer 1

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 
}

Im trying to prevent the dialog box from jquery from having padding

Sign up