CSS Layout

@glrodasz

no layout

https://codepen.io/glrodasz/pen/dKQJYP

@glrodasz

display property

https://codepen.io/glrodasz/pen/oyQEzw

@glrodasz

margin: auto;

max-width

text-align

https://codepen.io/glrodasz/pen/wXQjad

@glrodasz

box model

box-sizing

https://codepen.io/glrodasz/pen/EROrVP

@glrodasz

position

https://codepen.io/glrodasz/pen/yEQZvy​

@glrodasz

float

full-bleed

equal width columns

grids

https://codepen.io/glrodasz/pen/XYyGLP

@glrodasz

https://codepen.io/glrodasz/pen/dKQLap​

https://codepen.io/glrodasz/pen/VdVNJP

https://codepen.io/glrodasz/pen/dKQEov

floats for content

hiding overflow

@glrodasz

https://codepen.io/glrodasz/pen/bKQypm

https://codepen.io/glrodasz/pen/dKQBzw

inline-block

@glrodasz

https://codepen.io/glrodasz/pen/QxJXQG​

links

• https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements
• https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elements
• http://maxdesign.com.au/articles/inline/
• https://caniuse.com/#search=max-width
• https://github.com/necolas/normalize.css/
  https://github.com/sindresorhus/modern-normalize
• https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
• https://internetingishard.com/html-and-css/floats/
• http://es.learnlayout.com/

questions?