如何使用JavaScript创建中心按钮？

Question

I know my issue is easy to solve when using HTML, but here is how my buttons are set:

(In a JavaScript file)

var myButton=$('<button type="button" style="display:inline">Click</button>');

I have 6 buttons, and I would like to center all the buttons (they are put horizontally).

I tried to assign a class to each button, then wrap them in a same div :

$('.class1, .class2, .class3').wrapAll('<div class="wrap">');

And put in my CSS file

.wrap {
   text-align: center;
    }

But it didn't work.

Actually, I don't need class1 , class2 . Is there any other way to wrap all the buttons in a same div ?

Answer 1

Well you made them inline....They are doing what you told them to do, be in one line.

Make their display as block if you want them on their own lines.

Answer 2

将它们设置为是inline-block和所述设定width包裹物到它的父的宽度。

Answer 3

Set width and margin to the wrap

.wrap{
   width:400px; 
   margin:0 auto;  
}

Hope this helps http://jsfiddle.net/ZHdqK/2/

Answer 4

$('button').wrapAll($('<div class = "wrap">'));

.wrap{
    text-align:center;  
}

http://jsfiddle.net/rJD2B/