Difference between revisions of "User talk:Felixhc7"
From Fallen Sword Wiki
(New page: <span style="color:#060">If you need help using any of the code from my user page, feel free to ask.</span><br>~~~) |
|||
| Line 1: | Line 1: | ||
<span style="color:#060">If you need help using any of the code from my user page, feel free to ask.</span><br>{{User:Belgrave/Sig}} | <span style="color:#060">If you need help using any of the code from my user page, feel free to ask.</span><br>{{User:Belgrave/Sig}} | ||
| + | : If you build your basic layout, you can then put the following code everywhere you want a block with the rounded corners. It is basically just a simple table with specially positioned extras to create the illusion of rounded corners. Because the corners are technically extended outside the table, spacing is an issue. You will need to leave 2 blank lines between each of these if they are placed consecutively or inside the same cell of a larger table. | ||
| + | <pre>{| width="100%" cellspacing="20" | ||
| + | | width="50%" valign="top" | | ||
| + | {| width="100%" cellspacing="0" cellpadding="0" style="margin-top:10px;margin-bottom:10px;" | ||
| + | | style="border-bottom:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;background-color:#cd9e4b;" | <div style="position:relative;"><div style="position:absolute;top:-4px;left:0px;right:0px;height:1px;border-top:1px solid #000;margin-left:3px;margin-right:3px;margin-top:0px;"></div> | ||
| + | <div style="position:absolute;top:-3px;left:0px;right:0px;height:1px;border-left:2px solid #000;border-right:2px solid #000;margin-left:1px;margin-right:1px;background-color:#cd9e4b;"></div> | ||
| + | <div style="position:absolute;top:-2px;left:0px;right:0px;height:2px;border-left:1px solid #000;border-right:1px solid #000;margin-left:0px;margin-right:0px;background-color:#cd9e4b;"></div> | ||
| + | </div> | ||
| + | <span style="margin-bottom:15px;font-size:12pt"><center> | ||
| + | <!-- | ||
| + | |||
| + | |||
| + | Block Title goes in this section. Just be sure to delete the comment tags! | ||
| + | |||
| + | |||
| + | --> | ||
| + | </center></span> | ||
| + | |- | ||
| + | | style="border-left:1px solid #000;border-right:1px solid #000;background-color:#e5c173;padding:3px;" | | ||
| + | <!-- | ||
| + | |||
| + | |||
| + | Content goes in this section. Just be sure to delete the comment tags! | ||
| + | |||
| + | |||
| + | --> | ||
| + | |- | ||
| + | | style="border-top:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;background-color:#cd9e4b;" | | ||
| + | <!-- | ||
| + | Bottom Section Content goes here. Just be sure to delete the comment tags if you use it! | ||
| + | --> | ||
| + | <div style="position:relative;"> | ||
| + | <div style="position:absolute;bottom:-2px;left:0px;right:0px;height:2px;border-left:1px solid #000;border-right:1px solid #000;margin-left:0px;margin-right:0px;background-color:#cd9e4b;"></div> | ||
| + | <div style="position:absolute;bottom:-3px;left:0px;right:0px;height:1px;border-left:2px solid #000;border-right:2px solid #000;margin-left:1px;margin-right:1px;background-color:#cd9e4b;"></div> | ||
| + | <div style="position:absolute;bottom:-4px;left:0px;right:0px;height:1px;border-bottom:1px solid #000;margin-left:3px;margin-right:3px;"></div></div> | ||
| + | |}</pre> | ||
Latest revision as of 03:10, 11 July 2008
If you need help using any of the code from my user page, feel free to ask.
— Belgrave, Moderator / Sysop Talk Message PM
- If you build your basic layout, you can then put the following code everywhere you want a block with the rounded corners. It is basically just a simple table with specially positioned extras to create the illusion of rounded corners. Because the corners are technically extended outside the table, spacing is an issue. You will need to leave 2 blank lines between each of these if they are placed consecutively or inside the same cell of a larger table.
{| width="100%" cellspacing="20"
| width="50%" valign="top" |
{| width="100%" cellspacing="0" cellpadding="0" style="margin-top:10px;margin-bottom:10px;"
| style="border-bottom:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;background-color:#cd9e4b;" | <div style="position:relative;"><div style="position:absolute;top:-4px;left:0px;right:0px;height:1px;border-top:1px solid #000;margin-left:3px;margin-right:3px;margin-top:0px;"></div>
<div style="position:absolute;top:-3px;left:0px;right:0px;height:1px;border-left:2px solid #000;border-right:2px solid #000;margin-left:1px;margin-right:1px;background-color:#cd9e4b;"></div>
<div style="position:absolute;top:-2px;left:0px;right:0px;height:2px;border-left:1px solid #000;border-right:1px solid #000;margin-left:0px;margin-right:0px;background-color:#cd9e4b;"></div>
</div>
<span style="margin-bottom:15px;font-size:12pt"><center>
<!--
Block Title goes in this section. Just be sure to delete the comment tags!
-->
</center></span>
|-
| style="border-left:1px solid #000;border-right:1px solid #000;background-color:#e5c173;padding:3px;" |
<!--
Content goes in this section. Just be sure to delete the comment tags!
-->
|-
| style="border-top:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;background-color:#cd9e4b;" |
<!--
Bottom Section Content goes here. Just be sure to delete the comment tags if you use it!
-->
<div style="position:relative;">
<div style="position:absolute;bottom:-2px;left:0px;right:0px;height:2px;border-left:1px solid #000;border-right:1px solid #000;margin-left:0px;margin-right:0px;background-color:#cd9e4b;"></div>
<div style="position:absolute;bottom:-3px;left:0px;right:0px;height:1px;border-left:2px solid #000;border-right:2px solid #000;margin-left:1px;margin-right:1px;background-color:#cd9e4b;"></div>
<div style="position:absolute;bottom:-4px;left:0px;right:0px;height:1px;border-bottom:1px solid #000;margin-left:3px;margin-right:3px;"></div></div>
|}
