Text aligning and divs
In my previous tutorial I first wrote that paragraphs can be text align. THIS IS WRONG AND I HAVE FIXED THE TUTORIAL. The preview WILL show it works..... but won't work once you submit a comment, journal, submission, etc. So how do you align? You have to use the div tag.
Ah yes, the div tag, how I love you so when coding a site. These are the backbones used for layout. Don't worry, no big lesson here! They are only used for one main thing here, text aligning. But what exactly is a div? It's a block element, it is a division or section. You can add many elements within a div, like paragraphs, links, headers, and more!
<div>This is a div</div>
<p>This is a <span style="color:#FF00FF;">div</span> with some stuff in it!</p>
This is a div
This is a div with some stuff in it!
- More stuff!
Only divs can be aligned. Weasyl handles text aligning differently then usual. Not too incredibly different but instead of adding a property to the style attribute, they have pre-built classes you can use. I won't go into details about classes and ids are you cannot create your own here.
There are four ways to align: left (default), center, right, and justified. Unless it's a special reason, you don't have to align left as that is the default.
<div class="align-center">TEXT HERE</div>
<div class="align-left">Aligned Left</div>
<div class="align-center">Aligned Center</div>
<div class="align-right">Aligned Right</div>
<div class="align-justified">Aligned Justified</div>
What is justified?
Justified is also a text alignment, you may have seen it on a word processor program. What it does is that it tries to align the text to the left and right margins. This is commonly used in newspapers. This often causes gaps between words sometimes. I made this section justified to try and show it off!
Use the comments below to test it out yourself!