关闭按钮在对话框Jquery UI，ASP MVC4 .NET上不合适

Question

我做了一个简单的对话框来显示一些文字，它工作正常，但十字标记（关闭按钮）它的位置不对，我无法解决这个问题，我已经搜索了所有谷歌来解决它。

它的外观如下：

这是视图的代码：

@{
    ViewBag.Title = "Exito";
}


<script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<div id="message" title="Exito">
  <p>La cantidad de caracteres en la oracion es de: </p><div id="target" ></div><p> <b>(Incluyendo el "hola, escribiste:")</b></p>
</div>


@{
    ViewBag.Title = "Hola, Escribiste: ";
}



<script type="text/javascript">

    $('#message').dialog({


        resizable: false
    });

</script>

<hgroup class="title">
    <h1>@ViewBag.Title</h1>
    <h2 id="userMessage">@ViewBag.Message</h2>
</hgroup>




<script type="text/javascript">
    var Texto = "Hola, Escribiste: " + $('#userMessage').html();
    var myLength = Texto.length;
   // document.write("La cantidad de caracteres en la oracion es de " + myLength + " (Incluyendo el 'hola, escribiste')");
    $("#target").text(myLength);
   </script>