Jquery Mobile automatically adds

问题

i've got this code using Jquery Mobile :

<div role="main" class="ui-content">
  <form action="/" method="post">
    <fieldset data-role="controlgroup">
      <input type="checkbox" name="checkbox-1a" id="checkbox-1a" checked="">
      <label for="checkbox-1a">Cheetos</label>
      <input type="checkbox" name="checkbox-2a" id="checkbox-2a">
      <label for="checkbox-2a">Doritos</label>
      <input type="checkbox" name="checkbox-3a" id="checkbox-3a">
      <label for="checkbox-3a">Fritos</label>
      <input type="checkbox" name="checkbox-4a" id="checkbox-4a">
      <label for="checkbox-4a">Sun Chips</label>
    </fieldset>
   </form>
 </div>

The problem is that when i load the page the codes looks like this :

<div class="ui-controlgroup-controls ">
&nbsp;&nbsp;&nbsp;&nbsp;
<div class="ui-checkbox">

I've skipped the whole code, the problem is in the

 

that should not be there. Any idea about how to fix it?

回答1:

This problem comes when copying and pasting the source code from their website.

In fact in this way you copy also invisible blank spaces which are converted as   by the browser and make the last block go down.

To solve the issue simply remove all the spaces between the tags and all will be displayed correctly.

回答2:

There are many ways you can remove the automatic default padding.

First

<div style="padding: 0;">...</div>

Second: Define an id for the div tag and set padding to 0 in css

<div id="myID">
#myID{ padding:0; }

来源：https://stackoverflow.com/questions/27784062/jquery-mobile-automatically-adds-nbsp