javascript - jquery mobile collapsable checkbox list -


I've created a compressed checkbox list inside a popup using jquery mobile.

The problem is that there is a blank space on the left side of the list item and checkboxes (spaces) how can I get rid of this empty space, and keep the 100% check box in the consumption container? Thank you

Markup given inside your popup like this:

  & Lt; Div data-role = "compressed" data-abbreviated = "wrong" & gt; & Lt; H4 & gt; Title & lt; / H4 & gt; & Lt; Ul data-roll = "list view" id = "myList" & gt; & Lt; Li & gt; & Lt; Label & gt; & Lt; Input type = "checkbox" name = "checkbox-0" /> Check me & lt; / Labels & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; Label & gt; & Lt; Input type = "checkbox" name = "checkbox-1" /> Check me & lt; / Labels & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; Label & gt; & Lt; Input type = "checkbox" name = "checkbox-2" /> Check me & lt; / Label & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt;  

You can add some CSS rules to get rid of padding and spherical corners:

  #myList li {padding: 0; Border: 0! Important; } #myList li .ui-checkbox {margin: 0; } #myList li .ui-checkbox label {boundary-radius: 0! Important; }  

Here is a


Comments

Popular posts from this blog

java - org.apache.http.ProtocolException: Target host is not specified -

java - Gradle dependencies: compile project by relative path -

ruby on rails - Object doesn't support #inspect when used with .include -