Media query

(Shamelessly copying the content as-is)

https://msdn.microsoft.com/en-us/library/ms534161(v=vs.85).aspx

Property values

Type: String

all

Default. Applies to all devices.

print

Output is intended for printed material and for on-screen documents viewed in Print Preview mode.

screen

Output is intended for computer screens.

tv

Output is intended for television screens.

unknown

Intended output is unknown.

aural

Output is intended for speech synthesizers.

braille

Output is intended for braille tactile feedback devices.

embossed

Intended output is embossed.

handheld

Output is intended for handheld devices.

projection

Output is intended for projection devices.

tty

Output is intended for TTY devices

Bootstrap container vs container-fluid

I am Lazy :-)  Just copy & paste from Bootstrap official website.. he he he..

Containers

Bootstrap requires a containing element to wrap site contents and house our grid system. You may choose one of two containers to use in your projects. Note that, due to padding and more, neither container is nestable.

Use .container for a responsive fixed width container.

Copy

 class="container">
  ...

Use .container-fluid for a full width container, spanning the entire width of your viewport.

Copy

 class="container-fluid">
  ...

Bootstrap - col-[xs/sm/md/lg]

I always get confused if we need to specify col-xs, col-sm, col-md and col-lg classes for a column in bootstrap. If we specify col-xs it gets applied to xs, sm, md and lg unless we have different value for sm, md and lg. 

http://getbootstrap.com/css/ 

Introduction:

• Grid classes apply to devices with screen widths greater than or equal to the breakpoint sizes, and override grid classes targeted at smaller devices. Therefore, e.g. applying any .col-md-* class to an element will not only affect its styling on medium devices but also on large devices if a .col-lg-* class is not present.