CSS Lesson 2: Positioning Text and Adding Borders

Key Points:

  • To align text you use the text-align property in CSS:
    text-align: center;
    text-align: right;
  • By default all text will align to the left unless you specify otherwise within your CSS code.
  • You can place a period after a CSS property such as heading 1 (h1) or paragraph (p) and then a class name to separate it from your other specifications for that main property.
    • You might have a h1 like:
      h1{
      color: red;
      background-color: green;
      }
    • Then you may want a h1 that centers text also:
      h1.center{
      color:red;
      background-color: green;
      text-align: center;
      }
  • To give a border around text you use the border property:
    border: 3px solid red;

Click Here to View Code on GitHub!