RWD

RESPONSIVE WEB DESIGN

Responsive web design is the practice of building a website suitable to work on every device and every screen size mobile or desktop.

Responsive design is broken into three main components:

flexible layout media queries flexible media

Flexible layout is the way of building the layout of a website with a flexible grid. flexible grids are built using reletive length units % or em units.

Media queries are extensions that provide the ability to specify different styles for individual browser and device circumstances and width of the viewport.

Initializing Media Queries

@media
 

Flexible media is to make the images, videos and other media types scalable according to the viewport using a max-width of 100%.

WHAT IS FLOAT?

float is a CSS positioning property

SMACSS

SMACSS is a way of categorizing CSS rules in types of

• Base
• Layout
• Module
• State

• Theme

• References

• Shay Howe’s intro to RWD
• All About Floats