ASP.NET:How to make webform mobile responsive?

Question

I have ASP.NET project.I want it to change its view automatically when device is detected as mobile or as desktop.what are the ways available?please suggest some example projects.And i tried studying many tutos.But still i am unable to grasp them.So can any body suggest step by step method to do so?

Answer 1

For making your webpage responsive as per device

--> first you need to have bootstrap in your project.

--> you will be having container in your bootstap.css file(assets-->css-->bootstap.css).

--> container will be having different kind of screen types declared by default.like

EXAMPLE:

@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

--> you have to use these container in your cs file.In asp.net it is .aspx extention file.for

EXAMPLE:

<div class="below-slideshow" style="padding-bottom: 0px">
            <div class="container">  <!-- NOTICE HERE:inside div declare class as container/container-fluid-->
               <div class="row">
                   <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div>

                            <h1 class="head-line">Dashboard</h1>
                     </div>
                    </div>
                   </div>
             </div>
        </div>

--> To know more about container and container fluid http://www.w3schools.com/bootstrap/bootstrap_get_started.asp

HAPPY CODING :-)