如何将自定义图形放置在模态对话框的右上角?
How do I position my custom graphic in the upper right of my modal dialog?
我想用我自己的关闭按钮创建一个 jQuery UI 对话框,这将是一个图形。这是将用作对话框的 HTML
<div id="subscription_info">
<div id="modalCloseButton"><img alt="Close" src="/assets/ close_button-914fbebcf02bf2f4aa98140b8e0415aeefc1c6f017f4ecfa5d48805c4c5523ae.png" width="20"></div>
<div id="headerText"></div>
<div class="subscription_data_row">
Domain: mydomain.com
</div>
<div class="subscription_data_row">
Consumer Key: <span id="consumer_key"></span>
</div>
<div class="subscription_data_row">
Consumer Secret: <span id="consumer_secret"></span>
</div>
<div><a href="#">Why do I do with this?</a></div>
</div>
样式如下:
#modalCloseButton {
position: relative;
top:10px;
right:10px;
cursor: pointer;
}
虽然图片丢失了,但请注意 Fiddle — http://jsfiddle.net/gn26qos3/1/,“关闭”替代文本显示在中心位置,我希望它位于右上角。我怎样才能做到这一点?
只需将 text-align: right
添加到 #modalCloseButton
div 和 image/alt 文本,将向右对齐。
我想用我自己的关闭按钮创建一个 jQuery UI 对话框,这将是一个图形。这是将用作对话框的 HTML
<div id="subscription_info">
<div id="modalCloseButton"><img alt="Close" src="/assets/ close_button-914fbebcf02bf2f4aa98140b8e0415aeefc1c6f017f4ecfa5d48805c4c5523ae.png" width="20"></div>
<div id="headerText"></div>
<div class="subscription_data_row">
Domain: mydomain.com
</div>
<div class="subscription_data_row">
Consumer Key: <span id="consumer_key"></span>
</div>
<div class="subscription_data_row">
Consumer Secret: <span id="consumer_secret"></span>
</div>
<div><a href="#">Why do I do with this?</a></div>
</div>
样式如下:
#modalCloseButton {
position: relative;
top:10px;
right:10px;
cursor: pointer;
}
虽然图片丢失了,但请注意 Fiddle — http://jsfiddle.net/gn26qos3/1/,“关闭”替代文本显示在中心位置,我希望它位于右上角。我怎样才能做到这一点?
只需将 text-align: right
添加到 #modalCloseButton
div 和 image/alt 文本,将向右对齐。