TinyMCEが中心にならない

Question

何をしようとしても、私のtinyMCEテキストエディタを正しく中央に置くことができません。

は、ここにマークアップです：

<div id="container">  
<form method="POST" id="tiny_mce"><div class="title">YOUR POSTING</div><br> 
    Title:<br /> 
    <input type="text" name="title" /><br /><br /> 
    Your words:<br /> 
    <textarea name="words" class="tinymce" cols="30" rows="10"></textarea> 
    <br /><br /> 
    <input type="submit" name="submit" value="SUBMIT" /> 
    </form> 
</div> 

CSS：

*{ 
margin: 0; 
padding: 0; 

} 
body,html{ 
    margin:0 auto; 

} 
#container{ 
width:1200px; 
border:0px solid black; 
height:600px; 
margin:0 auto; 
} 
#tiny_mce{ 
display:block !important; 
float:left; 
margin-left:auto; 
margin-right:auto; 
} 
#tiny_mce input{ 
float:left; 
} 

Answer 1

これはあなたの浮動+何の幅を持っていないの奇妙な組み合わせによるものです。あなたは完全に左にしたいオブジェクトを中央に置こうとしていますが、これはお互いに直接衝突しています。また、#tiny_mce CSSには幅がありません。したがって、ブラウザがブロック要素の大きさを知ることができないため、左右の余白のオートオートは機能しません。 floatを削除して幅を追加すると、tiny_mceの中心になります。

Answer 2

float:leftを削除し、の幅をtiny_mceに付けてください。それが動作します。

#tiny_mce { 
    display: block !important; 
    margin-left: auto; 
    margin-right: auto; 
    width: 600px;  // You can give anything 
} 

http://jsfiddle.net/Nw8SJ/