User:CJC/BorderAlignmentExample

ShoutWiki — express yourself and be heard!
Jump to navigation Jump to search
Super basic border example
Hi
{| style= "border: 1px solid black"
|Hi
|}

In this simple example, we create a 1px solid black border. This can be changed to whatever style you want here. In general:

{| style = "border: width style colour"
|
|}
  • Width can be whatever thickness you want, although if you set it too large and it may hide the content.
  • Style is usually either solid, dashed or dotted. There may be some more settings but I can't remember them.
  • Colour can be any accepted colour name (red, black, blue, green) or any HTML colour code.

Now, you can also set the properties individually if you'd like (i.e., border-style: dashed or border-color: green), but it doesn't make a difference to the outcome.

Alignment
Hi
{| style= "border: 1px dotted black; float: right"
|Hi
|}

Here, I've set our basic little box to float right. It is as easy as just adding the "float: right" to the style section of your template. You can also float left (although that is usually the default) and float center.