/* This layout is very similar to the one found at W3Schools on this
same topic, I did this intentionally so you can use the tutorial
at W3Schools to help you with this assignment */
/* Use wildcard to apply style to everything */
* {
box-sizing: border-box;
}
body {
font-family: Arial;
padding: 10px;
background: #601020;
}
/* Header and Webpage Title */
.header {
padding: 10px;
text-align: center;
background: #AA00EE;
}
.header h1 {
font-size: 50px;
color: yellow;
}
/* Style the top navigation bar */
.topnav {
overflow: hidden;
background-color: #6600AA;
}
I will not be covering the css attributes (or properties) we discussed in the last css lecture here, I will focus on the new ones
Our first item is this line at the top indicating that every object "*" (The wildcard) will have a border-box
box-sizing: border-box;
Include padding and border in the element's total width and height
Let's look at this on the next page, there are a few thigs happening here