[英]centering jquery-ui button
Strange thing. 奇怪的事情。 I center a div
inside another div
, and all is fine until the inner div
is changed to .button
. 我将div
放在另一个div
中间,直到内部div
更改为.button
,一切都很好。 Then it is not centered any more. 然后,它不再居中。
html: HTML:
<div style='width:100%;'>
<div id='bt_click_me' class='button'>Click</div>
</div>
css: CSS:
#bt_click_me
{
width:100px;
margin: 0 auto !important;
}
When bt_click_me
is a regular div
with just a text, all is fine. 当bt_click_me
是仅包含文本的常规div
时,一切都很好。 when I do $('.button').button()
then it changes into a nice jquery-ui button, but also moves to the left side of the outer div
. 当我执行$('.button').button()
它变成一个漂亮的jquery-ui按钮,但也移到外部div
的左侧。 Any clues? 有什么线索吗?
I'm pretty sure this has to do with jQuery's CSS altering the behavior of the div by applying the ui-button
class, which switches the div from a block
to an inline-block
, thus making the margin: 0 auto;
我很确定,这与jQuery的CSS通过应用ui-button
类来改变div的行为有关,该类将div从一个block
切换到一个inline-block
,从而使margin: 0 auto;
style no longer a valid way to center it (inline elements cannot be centered with margin
). 样式不再是将其居中的有效方法(内联元素不能以margin
居中)。
Try adding display: block;
尝试添加display: block;
to your style, or add text-align: center;
您的样式,或添加text-align: center;
to your wrapper div. 到包装器div。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.