Mediawiki的模板：2并排的div

Question

所以，这是我到目前为止有：http://screencast.com/t/y8ajMJ3Cqm 这就是我希望做的：http://screencast.com/t/eeKlrhc1L

保存为不同的语言，这里是我的代码那个小模板：

<div style="border: 1px solid; border-color: #339933; background-color: #ccffcc; width: 500px;"> 
<div style="margin: 5px;" width 150px; float: left; display:inline;>{{{2}}}</div> 
<div style="margin: 5px; float: left; width: 330px;> 
<div style="padding-left: 5px; margin: 5px; border: 1px solid; border-color: #336633; background-color: #66cc66;"><h3>{{{1}}}</h3></div> 
<div style="margin: 5px; padding: 5px;">{{{3}}}</div> 
</div> 
<div style="clear: both;";></div> 
</div> 

我有一个容器div，里面还有两个div：“float：left”。其中的第一个有它的形象，它不知道如何用“标题”和描述推动其他div。我已经在这个大约2个小时，并想在研磨机中研磨侏儒。

Answer 1

如果您希望浮动块“推开”一个块而不是重叠块（并且只推开其中的文本），则必须在该块上设置overflow:hidden或float。 （请参阅block formatting context的概念以获得解释。）

Answer 2

我注意到的第一件事是您的样式定义中丢失和不合适的" ..检查您的第二和第三行。应该是这样的：

<div style="border: 1px solid; border-color: #339933; background-color: #ccffcc; width: 500px;"> 
<div style="margin: 5px; width 150px; float: left; display: inline;">{{{2}}}</div> 
<div style="margin: 5px; float: left; width: 330px;"> 
<div style="padding-left: 5px; margin: 5px; border: 1px solid; border-color: #336633; background-color: #66cc66;"><h3>{{{1}}}</h3></div> 
<div style="margin: 5px; padding: 5px;">{{{3}}}</div> 
</div> 
<div style="clear: both;";></div> 
</div> 

不知道到底是什么{{{1}}}{{{2}}}{{{3}}}是，这是我很难帮你进一步。也许你可以在默认文本中输入，以便我们看到，并且可以将它放在我的沙箱中的家庭wiki上进行播放。