cssで何度も調べてしまうことをメモに残しておきます.
完全に自分用のメモなので変なことを書いてるかもしれないです.
display
その要素をブロック要素とインライン要素のどちらとして扱うか、および子要素をどのようにレイアウトするかということを指定します.
block, inline
その要素自体をブロック要素とインライン要素のどちらとして扱うかということを指定します.
inline-block もこの部類に入りますが、MDNには旧来のものとして掲載されています. 後述する2値の構文が使用可能になったcss3ではよい方法とは言えないようです（より良い方法があるという意味）.
flex, grid
子要素をどのようにレイアウトするかということを指定します. どちらも子要素をブロック要素のように扱いつつも横に並べることが出来ますが、グリッドモデルの方がより自由度が高いです. 具体的には、フレックスボックスモデルはブロック要素を縦か横の一列にしかレイアウトできないのに対し、グリッドモデルは多次元に配置することが出来るそうです.
なお、フレックスボックスモデルの代わりに floatプロパティ を使用することもできるらしいですが、現代風ではない？方法のようです.
none
表示しない（領域そのものを生成しない）.
2値の構文
すでに見てきたようにdisplayプロパティはその要素自身のレイアウトに関するものと子要素のレイアウトに関するものがあります. この2種類のプロパティはスペース区切りで同時に指定することが出来ます（2値の構文）.
display: block flex; display: inline flex;
displayプロパティの参考ページ
position
その要素の位置（正確には要素の左上の座標）をどのように指定するかを決めることが出来ます.
とる値が5種類しかありません.
static
デフォルトの値. top、bottom、right、left、z-indexプロパティが適用されません.
relative
要素が本来配置されるべき位置が基準となります. デフォルトではstaticと変わりませんが、top、bottom、right、left、z-indexプロパティを適用することが出来るようになります.
absolute
親要素の配置位置（親要素の左上の座標）が基準になります. 適用するためには 親要素のpositionがstatic以外である必要があります.
fixed
fixedはビューポートの左上を基準にして要素を固定します. 画面に張り付くような見栄えになりますが、position:fixedを指定した要素は高さがなくなります.
sticky
親要素を基準にしたfixedという感じです. fixedとは違い高さはなくなりません.
position:stickyを指定しただけではスクロールに追従してくれません. 必ずtop or left プロパティなどを指定する必要があります.
