2011-12-08 2 views
1

내가하려는 일에 상관없이 필자는 tinyMCE 텍스트 편집기를 제대로 센터에 배치 할 수 없습니다.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; 
} 

답변

1

이것은 당신의 부동 + 더 폭이없는의 이상한 조합 때문이다. 당신은 완전히 왼쪽에 있기를 원하는 대상을 중심에 놓으려고합니다. 이것은 서로 직접적인 충돌입니다. 또한 #tiny_mce CSS에는 너비가 없으므로 브라우저가 블록 요소의 크기를 알지 못하기 때문에 왼쪽 및 오른쪽 여백에 자동 자동 기능이 작동하지 않습니다. float을 제거하고 너비를 추가하면 tiny_mce가 가운데에 맞춰집니다.

+0

덕분에, CSS는 하하 ... 지금은 더 의미가 있습니다 – user701510

3

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/

관련 문제