Hi Jakerlund,
I see the problem you’ve been trying to describe here, and would like to answer as following.
– We’ve include the first CSS tag in this template just for dynamically control of template’s elements, for example Heading Style (H1, H2, H3..). This is why when you removed the tag, the logo becomes messed up. But this way of coding CSS also has a limit, as you mentioned about.
For the solutions, there are 2 ways for you:
1st> Keeping the 1st tag, and try to use stylesheet (CSS) to style all of your add-in elements.
For example, to make a padded table and make it align center, the code should be:
[PHP]<table border=”0″ cellspacing=”0″ cellpadding=”0″ width=”300″ align=”center” style=”margin: 0 auto;”>
<tbody>
<tr>
<td valign=”top” style=”width: 50%; background-color: #ff6600; padding: 10px;”>
Table <br />10 pix padding<br />1 pix spacing<br />
</td>
<td valign=”top” style=”background-color: #ff6600; padding: 10px;”>
Aligned centered<br />
</td>
</tr>
</tbody>
</table>[/PHP]
And surely, the simple way to do this trick is adding a class to the table, then define that class in your CCS.
For example, to make a padded table and make it align center, you can do like this:
– Add a class to a table.
<table border="0" cellspacing="0" cellpadding="0" width="300" align="center" class="padded-tb">
...
</table>
– Then define the style for the table in your CSS
table.padded-tb {
margin: 0 auto;
}
table.padded-tb td {
padding: 10px;
background-color: #ff6600;
}
==> This is a very versatile way and you will use the real power of CSS. If you have 5 tables like the one you need, just add the predefined class to them and you’ve done! 😉
2nd> Removing the 1st tag, and try to fix the bugs.
– For the logo, just find this code:
#ja-header h1 {
font-size: 2em;
position: absolute;
top: 0;
left: 0;
}
and change it to:
#ja-header h1 {
font-size: 2em;
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: 0;
}
– For the transmenu, just find this code:
body#bd {
background: #EFEFEF;
}
and change it to:
body#bd {
background: #EFEFEF;
margin: 0;
padding: 0;
}
I hope this post will point out something for you! Further questions, please feel free to ask us again! 😀
