How to Create an Infobox: Difference between revisions

m
Line 20: Line 20:
</tr>
</tr>
</table>
</table>
Again, if you are familiar with Wikitext or HTML programming, you should notice following the table tag this coding: class="infobox".  This is the magic word which tells the browser that a infobox is going to be created.
Again, if you are familiar with Wikitext or HTML programming, you should notice this coding: <em>class="infobox"</em> in the table tag .  This code tells the browser that a infobox is being created and to place it in the upper right hand corner of the article.


Next we want to give the infobox some style considerations such as width, borders, padding, font size, and maybe background color:
Next if we want to give the infobox some style considerations such as width, borders, padding, font size, and maybe background color:
<table style="width:99%; border:1px solid blue; ">
<table style="width:99%; border:1px solid blue; ">
<tr>
<tr>
Line 29: Line 29:
</tr>
</tr>
<tr>
<tr>
<td style="border:1px solid blue; "><nowiki>{| class=infobox style="width:30%; text-align:left; padding:0px; font-size:8pt; float:right; border:1px solid black; border-right-width:2px; border-bottom-width:2px; background-color:white;"....|}</nowiki></td>
<td style="border:1px solid blue; "><nowiki>{| class=infobox style="width:200px; text-align:left; padding:0px; font-size:8pt; border:1px solid black; border-right-width:2px; border-bottom-width:2px; background-color:white;"....|}</nowiki></td>
<td style="border:1px solid blue; "><nowiki><table class=infobox style="width:30%; text-align:left; padding:0px; font-size:8pt; float:right; border:1px solid black; border-right-width:2px; border-bottom-width:2px; background-color:white;">...</table></nowiki></td>
<td style="border:1px solid blue; "><nowiki><table class=infobox style="width:200px; text-align:left; padding:0px; font-size:8pt; border:1px solid black; border-right-width:2px; border-bottom-width:2px; background-color:white;">...</table></nowiki></td>
</tr>
</tr>
</table>
</table>
You can see in the coding the styles we have given our infobox.
You can see in the coding the styles we have given our infobox.