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.
精彩评论