Jquery模式框关闭按钮造型问题与自定义主题

Question

我最近为我的网站上使用的Jquery UI创建了一个自定义主题。我还为用户添加了一个模式框表单来上传文件。一切都很好。我遇到的一个小问题是关闭按钮的外观。 X出现在按钮本身之外。见下图。我猜这与冲突的风格有关，但我不确定导致问题的地点或原因。任何帮助，将不胜感激。谢谢！

这是我唯一能找到的东西。当我在浏览器中检查元素时，我看到了：

<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="close"></button>

显示表单的实际代码如下所示：

    $(function() 
    { 
        $( "#dialog-form" ).dialog({
          autoOpen: false,
          width: 400,
          height: 300,     
          modal: true,
          buttons: {
              "Add File": function() 
        {
        $('form#addFile').submit();
              },
              Cancel: function() 
              {
                   $( this ).dialog( "close" );
           $('#uploadFile').val( "" );
              }
         },
         close: function() {
         $( this ).dialog( "close" );
         }
    });

    $( "#new-file" )
      .button()
      .click(function() {
        $( "#dialog-form" ).dialog( "open" );
    });
});

在Web控制台中使用样式编辑器后，我能够在jquery-ui-1.9.2.custom.min.css中识别出样式定义作为罪魁祸首：

.ui-dialog .ui-dialog-titlebar-close span {
    display: block;
    margin: 1px;

特别是保证金：1px。不知道为什么，但删除此行修复了问题。感谢所有评论的人！