locked
How to Convert asp.net web application to responsive web page RRS feed

  • Question

  • User-1202100973 posted

    Hi every one,

    I have  asp.net web application. And I use JavaScript and jQuery.

    And all the U.I controls are in content place holders like Div, tables.

    And this application interacts with sql Server (Backend)

    So Now I have a requirement as this to convert to  responsive web page

    I have been going through http://materializecss.com/  where all the U.I is divided in 12 parts and based on the device it mapping how many party to display  and so on…..

    So now do I need to rewrite all the U.I code or do I need to encapsulate it in some class(rows,columns)

    Any leads how to achieve responsive web page.

     So once I make it responsive web page will be work in Mobiles i.e IPhone/Android.

    Thank You for all the Help.

    Tuesday, September 20, 2016 9:54 PM

Answers

  • User475983607 posted

    So Now I have a requirement as this to convert to  responsive web page

    I have been going through http://materializecss.com/  where all the U.I is divided in 12 parts and based on the device it mapping how many party to display  and so on…..

    So now do I need to rewrite all the U.I code or do I need to encapsulate it in some class(rows,columns)

    You must design the page according to the specifications outlined by the responsive framework you select

    Any leads how to achieve responsive web page.

    There is no magic... You'll need to format the HTML according to the framework documentation.

    http://materializecss.com/

    So once I make it responsive web page will be work in Mobiles i.e IPhone/Android.

    Yes, that is the definition of responsive.  If you site does not work on all screen resolutions then your site is not responsive.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, September 21, 2016 12:34 AM
  • User1724605321 posted

    Hi Aditya_ven ,

    Yes ,and Materialize css provides simple responsive css class ,that could be applied to related items . For example ,to make the table horizontally scrollable on smaller screen widths , you need just add class="responsive-table" to the table tag . Also check below links for more details :

    http://materializecss.com/getting-started.html

    http://blog.codeply.com/2015/04/09/5-material-design-examples-using-materializecss/ 

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, September 28, 2016 2:12 AM

All replies

  • User475983607 posted

    So Now I have a requirement as this to convert to  responsive web page

    I have been going through http://materializecss.com/  where all the U.I is divided in 12 parts and based on the device it mapping how many party to display  and so on…..

    So now do I need to rewrite all the U.I code or do I need to encapsulate it in some class(rows,columns)

    You must design the page according to the specifications outlined by the responsive framework you select

    Any leads how to achieve responsive web page.

    There is no magic... You'll need to format the HTML according to the framework documentation.

    http://materializecss.com/

    So once I make it responsive web page will be work in Mobiles i.e IPhone/Android.

    Yes, that is the definition of responsive.  If you site does not work on all screen resolutions then your site is not responsive.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, September 21, 2016 12:34 AM
  • User-1202100973 posted

    Hi Mgebhard,

    Thank you for your response. Then I have to create all the pages with proper Div's as per materializecss.com

    So I have  completely do the coding of aspx page,

    So that to render across all the browsers.

    Wednesday, September 21, 2016 3:50 AM
  • User1724605321 posted

    Hi Aditya_ven ,

    Yes ,and Materialize css provides simple responsive css class ,that could be applied to related items . For example ,to make the table horizontally scrollable on smaller screen widths , you need just add class="responsive-table" to the table tag . Also check below links for more details :

    http://materializecss.com/getting-started.html

    http://blog.codeply.com/2015/04/09/5-material-design-examples-using-materializecss/ 

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, September 28, 2016 2:12 AM