「 INSIDE THE MIND 」

HTML & CSS for Dummies: Useful snippets of code

Date: July 28, 2023

Everyone who's ever attempted to make their own website knows the great struggles of looking top to bottom searching for some code, or not knowing the solution to a problem was something so obvious. Here's a view pieces of code that I use frequently, that may be helpful to you to!

overflow: auto;

This simple bit of code makes whatever you place it on into a scroll box! Make sure you set a height or a max-height property though...

text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;

This adds an outline to any desired text. The colour set here is black, so make sure to change the hex value! You can use colour names or hex codes.

border-radius: 50%;

This just makes whatever element you're adding it to into a circle. Pretty neat!

the marquee tag

While the marquee tag is somewhat outdated, if you're in favour of the old web slapping a marquee onto some elements really give it that extra kick. There's a lot you can do with marquee's so check out mozilla's marquee guide here.

font-weight: bold; & font-style: italic;

Two very useful little bits of CSS that can make text bold and/or italic.

main aside header & footer tags

Yes, you can make your own tags instead of making lots of divs! The most commonly used are main, aside, header and footer. Aside is used for boxes that are besides the main page, like the nav box on this blog! These tags can also be helpful for organisational purposes.

There is so much code that goes into crafting even the simplest of websites, but hopefully these 1UP your coding skills.

- CHARLIE