layout |
---|
page |
- Every html tag is surrounded by a box. The box consists of the content, padding, border and margin. Let's discuss each property individually.
- Certain tags have default display values. For example, an
h1
tag is a block-level tag andimg
is an inline tag. We can alter this by changing the CSS.
-
How do we group multiple tags together?
-
Semantic tags can replace
div
s to provide more context than a generaldiv
.
- We can use the grid system (Bootstrap), which works fine but requires more digging into docs and base knowledge about how it works.
- Flexbox allows us to manipulate the position of tags without all the knowledge of a larger grid system.
- Clone down this repo. Open the
index.html
file from your command line (For atom,atom open index.html
). - Check out the CSS and HTML files to see what is going on.
- display: flex;
- flex-direction: row | row-reverse | column | column-reverse
- order - displays in numerical order
- flex-wrap
- Most eye-burning website, wins!