jquery Mobile plugin lable and input do not appear on one line

First I used the Fieldcontain attribute:

The code is as follows	Copy Code
<form method= "POST" action= "" > <div data-role= "Fieldcontain" > <label for= "FullName" > Gaojiazhuang www.111cn.net</label> <input type= "text" Name= "FullName" id= "FullName" > </div> </form>

This property successfully lets lable and input appear on the same line, but it's too early to be happy, because in the normal size of the PC browser It's OK, but considering that the mobile Device browsing window isn't that big, The test found that when the screen size is less than 480px, lable and input will separate two lines. However, the screen size of mobile devices is not only 480px, although mobile devices to the big screen, but still have 128px, 320px. So we have to find a new solution.

Normal display when the screen is larger than 480px with Fieldcontain

Lable and input are still in two lines when the screen is less than 480px after using Fieldcontain

I found that a lot of people have encountered the same problem, but have not solved, see a friend gave the way is to customize the CSS style

@media (max-width:480px)

But I did not achieve the desired goal after the test, I do not know whether this method is correct, maybe my hair method is wrong, we can test themselves ~

Domestic forum did not find more methods, students told me to look at the foreign community, so to the Google search, found a lot of new methods, although most can not be used, but the foreign response is much higher than the domestic, so later in the foreign technical community.

The solution found is to use table.

Label in a TD and input in a TD, which allows jquery mobile lable and input to display in the same line when the screen is less than 480px, Lable put a line, input put a line.

The code is as follows	Copy Code
<form method= "POST" Action= ""     <div data-role= "Fieldcontain"       < Table>         <tr>            <td>             <label for = "FullName" > Gaojiazhuang </label>           </td>            <td>              <input type= "text" Name= "FullName" id= "FullName"            </td>         </tr>        </table>     </div> </form>