开发者

Mediawiki Template: 2 side by side divs

So, this is what I have so far: http://screencast.com/t/y8ajMJ3Cqm And this is what I'm looking to do: http://screencast.com/t/eeKlrhc1L

Save for the different language, here is my code for that little template:

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

I have one container div, and inside that, two other divs that are both "float:left". The first of those has the image in it, which is somehow not pushing over the other div with the "title" and description. I've been at this for around 2 hours and want to grind gnomes in a blender.


If you want floats to "push away" a block instead of overlapping it (and only pushing away the text in it), you must set overflow:hidden or float on that block. (See the concept of a block formatting context for explanation.)


First thing I notice is missing and out of place " on your style definitions.. Check your second and third rows. Should look like this:

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

Without knowing exactly what {{{1}}} {{{2}}} {{{3}}} are, it's hard for me to help you further. Perhaps you could pipe in default texts for us to see and I can throw it on my home wiki in my sandbox to play with.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜