centrage jquery-ui bouton

Question

Chose étrange. Je centre un div à l'intérieur d'un autre div, et tout va bien jusqu'à ce que le div intérieur est changé en .button. Alors ce n'est plus centré.

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; 
} 

Lorsque bt_click_me est un div régulier avec juste un texte, tout va bien. quand je fais $('.button').button() alors il se transforme en un joli bouton jquery-ui, mais se déplace également sur le côté gauche de l'extérieur . Des indices?

Answer 1

Je suis sûr que cela a à voir avec le CSS de jQuery modifier le comportement de la div en appliquant la classe ui-button, qui commute la div d'un block à un inline-block, rendant ainsi le style margin: 0 auto; plus un moyen valable de centrez-le (les éléments en ligne ne peuvent pas être centrés avec margin). Essayez d'ajouter display: block; à votre style ou ajoutez text-align: center; à votre div wrapper.