more notes Flashcards
how to change the spacing between lines
line - height
what does object-fit do
we use it if the height and width of the image doesn’t match its dimensions
what is <div>
division, or just a box
- is a block element
why is a div
can contain any other elements inside of divs - eg paras, images etc
block elements in divs
they take up the entire line IN THEIR CONTAINER
if we set the width to 100%, what does that mean
the element takes up 100% of its container
how to do inline styles (target css in a line rather than in a paragraph)
- <style = “write css here”
what is a grid
a layout that has rows and columns
how to make a grid
make a div
set the divs display to grid
set the grid-template-columns num,num,num
what does 1fr mean in a grid
that specific part of the grid will take up the remaining free space of the page
- the 1 is a ratio, if it was 2, it would be double the size of the first div
how to add space under a grid
add padding inside the body element
how to make a grid with equal spacing between the boxes
use 1fr 1fr 1fr
- set the column-gap and row-gap
how to create a flex box
set display : flex;
set the flex-direction
how to get a box to take up remaining space on the page using flex box
use flex:1
how to change where contents of a flexbox start
justify-content : start / end / center
