css page layout
DESCRIPTION
1st versionTRANSCRIPT
Mr. Thien Tran QuangCSS Slicer [email protected]
Box ModelPage LayoutPositioning
What is this?How works it?
Three-dimensional visualization of the CSS box model
Remember: the width property declares the width
of the element’s contents, not its box.
IntroductionEqual height problem
“What the designer sees,
the user sees”
Fixed Layout
“Flexible for
differents screen
resolution”
Fluid Layout
Mixes the two
other main
layout types. It
works by sizing
all elements with
em‘s.
Elastic Layout
The height of each column is depend the contents in column.
Key: Relative position property .
Key: Background Repeat Property
Position:static | relative | absolute | fixed Floating and Clearing
Mystery of Float
Clearing
Float column and “footer problem”
“Footer problem” and solution