Question

我有以下内容：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Testing PasteHTML.com</title>
        <link type="text/css" href="http://optdev.shellprompt.net/css/jquery-ui-1.8.1.custom.css" rel="stylesheet">
  </head>
  <body>
        <div class="notification" id="notification-message">
            <div class="ui-widget">
                <div style="padding: 0 .7em;" class="ui-state-error ui-corner-all"> 
                    <span style="float: right;cursor:pointer" onclick="$x_Remove('notification-message')" class="ui-icon ui-icon-closethick"></span>
                    <div id="message" style="float:left">Invalid Login Credentials</div>
                </div>
            </div>
        </div>
  </body>
</html>

Message和“X”都在父div之外。如何将它们放在父母身边？

这是一个演示http://pastehtml.com/view/bngl4k1th.html，我希望它看起来像JQuery UI Theme http://tinyurl.com/dbqg2t警报消息

Answer 1

刚刚开始使用jQuery UI主题，一旦我添加它完美无缺，我就错过了ui-helper-clearfix类。

Answer 2

在结束父标记之前，您可以将overflow:hidden添加到父标记或添加clear:both属性的新div。

Css在jquery ui主题小部件中浮动两个元素

2 个答案: