居中jquery-ui按钮

奇怪的事情。我中心div在另一个div内，并且一切正常，直到内部div更改为.button。然后它不再居中。居中jquery-ui按钮

HTML：

<div style='width:100%;'> 
    <div id='bt_click_me' class='button'>Click</div> 
</div>

CSS：

#bt_click_me 
{ 
    width:100px; 
    margin: 0 auto !important; 
}

当bt_click_me是一个普通的div只是一个文字，一切都很好。当我做$('.button').button()时，它会变成一个不错的jquery-ui按钮，但也会移动到外部div的左侧。任何线索？

2011-09-28 Jakub M.

是在你的CSS的其他地方使用的按钮类可能会混淆的CSS？ –

我认为你必须有一些冲突的CSS。您可以在http://jsfiddle.net/或http://jsbin.com/上重新创建您的问题，或提供指向您网页的链接？ – thirtydot

类**按钮**定义可能是问题。 – punit

我敢肯定，这与jQuery的CSS通过应用ui-button类，它从block股利切换到inline-block改变div的行为，从而使margin: 0 auto;风格不再是一个有效的方式做居中（内联元素不能以margin为中心）。

尝试将display: block;添加到您的样式，或将text-align: center;添加到您的包装div。

2011-09-28 19:39:41

宾果！ 'display：block'适合我 –

回答