Targeting Multiple Devices using Bootstrap 3 -

i developing website targeting on phones, tablets , desktops. let's have div element. way handle these devices, should have 3 different version of codes or maybe have include class in 1 div :

<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">content</div> 

thank you.

just example, bootstrap can use multiple col-* classes in single div. smaller grid classes also apply larger screens unless overriden larger screens. therefore, only need use class smallest device width want support. smaller widths 768 pixels stack vertically (12 columns) unless use xs classes

• xs - less 768 px
• sm - 768 px , greater
• md - 992 px , greater
• lg - 1200 px , greater

examples...

12 columns wide on all devices: (you don't need sm,md,lg unless want different widths on each device)

<div class="col-xs-12">content</div> 

6 columns wide on desktop(lg), laptop(md), tablet(sm), 12 columns on phone(xs):

<div class="col-sm-6">content</div> 

6 columns wide on on all devices:

<div class="col-xs-6">content</div> 

4 columns on lg , md, 6 cols on sm , xs:

<div class="col-md-4 col-xs-6">content</div> 

demo more examples: http://www.bootply.com/73778