CSS Tips and Tricks

https://clrs.cc/

https://htmldog.com/techniques/underlines/
To apply underlines to links that are slightly different than the simple text-decoration: underline, you can switch off the underline and use some other jiggery-pokery to achieve underlining effects.

https://css-tricks.com/styling-underlines-web/

text-decoration is the most straightforward way to underline text. You apply a single property and that’s all there is to it. At smaller sizes, it can look pretty decent, but increase the font size and the same line starts to feel clumsy.

The biggest problem with text-decoration is its lack of customizability. It uses the color and font size of whatever text its applied to and there’s no cross-browser way to change the style.

.underline {
  border-bottom: 2px solid currentColor;
}

.underline--blue {
  border-bottom-color: blue;
}

.underline--dotted {
  border-bottom: 3px red dashed;
}

border-bottom offers a good balance between being quick and customizable. This approach uses a tried-and-true CSS border, which means you can change color, thickness, and style with ease.

https://stackoverflow.com/questions/11659290/underline-h1-within-a-div
H1 is a a block element, so it grows to fill its parent. You can set display: inline, but I also suggest to put it in its own div (or any other element with display: block) so you ensure that no content goes along side

​h1 {
  border-bottom: 3px solid red;
  display: inline;
}​

• CENTERING THINGS
  • P { text-align: center }
• To center an image, set left and right margin to auto and make it into a block element

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}