How to create a Fieldcontain mini sized using jQuery Mobile ? Last Updated : 16 Dec, 2020 Summarize Comments Improve Suggest changes Share Like Article Like Report jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Fieldcontain mini sized using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=”stylesheet” href=”http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css” /> <script src=”http://code.jquery.com/jquery-1.11.1.min.js”></script> <script src=”http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js”></script> Example: We will create a Fieldcontain mini sized area using jQuery Mobile. We use class="ui-field-contain" attribute to set the mini sized field. HTML <!DOCTYPE html> <html> <head> <link rel="stylesheet" href= "http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" /> <script src= "http://code.jquery.com/jquery-1.11.1.min.js"> </script> <script src= "http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </script> </head> <body> <center> <h1>GeeksforGeeks</h1> <h4> Design a Fieldcontain mini sized using jQuery Mobile </h4> <form style="width: 50%;"> <div class="ui-field-contain"> <label for="TextInput1">Input Text:</label> <input type="text" data-clear-btn="false" name="TextInput1" id="TextInput1" value=""> </div> <div class="ui-field-contain"> <label for="TextInput2"> Text Input with clear Button: </label> <input type="text" data-clear-btn="true" name="TextInput2" id="TextInput2" value=""> </div> <div class="ui-field-contain"> <label for="searchInput1"> Search Input: </label> <input type="search" name="searchInput1" id="searchInput1" value=""> </div> <div class="ui-field-contain"> <label for="textareaInput"> Search Input with clear Button: </label> <textarea cols="40" rows="8" name="textareaInput" id="textareaInput" value=""> </textarea> </div> </form> </center> </body> </html> Output: Comment More infoAdvertise with us Next Article How to create a Mini sized Slider using jQuery Mobile ? P ppatelkap Follow Improve Article Tags : Web Technologies JQuery jQuery-Misc jQuery-Mobile Similar Reads How to create a Fieldcontain, mini sized Slider using jQuery Mobile ? jQuery Mobile is a web-based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a Fieldcontain, mini-sized slider using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link re 1 min read How to create a Fieldcontain Slider using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a Fieldcontain slider using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€styleshee 1 min read How to create Mini Fieldcontain flip toggle switch using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be making Mini Fieldcontain flip toggle switch using jQuery Mobile. Approach: First, add jQuery Mobile scripts needed for your project. < 1 min read How to create a Mini sized Slider using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Mini sized Slider using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†1 min read How to create a Mini sized selects using jQuery Mobile ? jQuery Mobile is a web-based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be creating a Mini sized selects using jQuery Mobile. Approach: First, add jQuery Mobile scripts needed for your project. <link rel="sty 1 min read How to create Fieldcontain flip toggle switch using jQuery Mobile ? jQuery Mobile is a web-based technology used to make responsive content that can be accessed on all smartphones, tablets, and desktops. In this article, we will be making Fieldcontain flip toggle switch using jQuery Mobile. Approach: First, add jQuery Mobile scripts needed for your project. <link 1 min read Like