title: CSS DIV column-count height not adjusted
body: <p>I'm trying to achieve a 3 column layout using the <code>column-count</code> property. But it gives me strange effects in <strong>Webkit</strong> and <strong>Blink</strong> (Google Chrome) <em>[Firefox 3.6+ works fine]</em>. If you look at the attached code and run the snippet, you can see that there is some extra space after the checkboxes and before the button at the end.
  <img src="https://i.stack.imgur.com/Bg0y1.png" alt="image of the problem, rendered in Safari">
  Actually, as you can see in the inspector, the <code>&lt;div class="centeredForm formEntry optionList"&gt;</code> containing the <code>&lt;div class="centeredForm optionListMainContainer" style="margin-top: -1.525em;"&gt;</code> gets the wrong height. It behaves as the <code>column-count</code>property was not set.
  Is there a workaround for this problem in Webkit?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
  
  /**
   * 1. Set default font family to sans-serif.
   * 2. Prevent iOS text size adjust after orientation change, without disabling
   *    user zoom.
   */
  
  html {
    font-family: sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
  }
  /**
   * Remove default margin.
   */
  
  body {
    margin: 0;
  }
  /* HTML5 display definitions
     ========================================================================== */
  
  /**
   * Correct `block` display not defined for any HTML5 element in IE 8/9.
   * Correct `block` display not defined for `details` or `summary` in IE 10/11
   * and Firefox.
   * Correct `block` display not defined for `main` in IE 11.
   */
  
  article,
  aside,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  main,
  menu,
  nav,
  section,
  summary {
    display: block;
  }
  /* Forms
     ========================================================================== */
  
  /**
   * Known limitation: by default, Chrome and Safari on OS X allow very limited
   * styling of `select`, unless a `border` property is set.
   */
  
  /**
   * 1. Correct color not being inherited.
   *    Known issue: affects color of disabled elements.
   * 2. Correct font properties not being inherited.
   * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
   */
  
  button,
  input,
  optgroup,
  select,
  textarea {
    color: inherit;
    /* 1 */
    font: inherit;
    /* 2 */
    margin: 0;
    /* 3 */
  }
  /**
   * Address `overflow` set to `hidden` in IE 8/9/10/11.
   */
  
  button {
    overflow: visible;
  }
  /**
   * Address inconsistent `text-transform` inheritance for `button` and `select`.
   * All other form control elements do not inherit `text-transform` values.
   * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
   * Correct `select` style inheritance in Firefox.
   */
  
  button,
  select {
    text-transform: none;
  }
  /**
   * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
   *    and `video` controls.
   * 2. Correct inability to style clickable `input` types in iOS.
   * 3. Improve usability and consistency of cursor style between image-type
   *    `input` and others.
   */
  
  button,
  html input[type="button"],
  input[type="reset"],
  input[type="submit"] {
    -webkit-appearance: button;
    /* 2 */
    cursor: pointer;
    /* 3 */
  }
  /**
   * Re-set default cursor for disabled elements.
   */
  
  button[disabled],
  html input[disabled] {
    cursor: default;
  }
  /**
   * Remove inner padding and border in Firefox 4+.
   */
  
  button::-moz-focus-inner,
  input::-moz-focus-inner {
    border: 0;
    padding: 0;
  }
  /**
   * Address Firefox 4+ setting `line-height` on `input` using `!important` in
   * the UA stylesheet.
   */
  
  input {
    line-height: normal;
  }
  /**
   * It's recommended that you don't attempt to style these elements.
   * Firefox's implementation doesn't respect box-sizing, padding, or width.
   *
   * 1. Address box sizing set to `content-box` in IE 8/9/10.
   * 2. Remove excess padding in IE 8/9/10.
   */
  
  input[type="checkbox"],
  input[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
  }
  /**
   * Define consistent border, margin, and padding.
   */
  
  fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
  }
  /**
   * 1. Correct `color` not being inherited in IE 8/9/10/11.
   * 2. Remove padding so people aren't caught out if they zero out fieldsets.
   */
  
  legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
  }
  div.subVCs {
    width: 100%;
    position: relative;
  }
  .view-size-100p {
    width: 100%;
    display: inline-block;
    position: relative;
    vertical-align: top;
    padding: 2px 6px 3px 6px;
  }
  @media only handheld,
  only screen and (max-width: 1024px),
  only screen and (max-device-width: 1024px) {
    .view-size-100p {
      width: 100%;
      display: block;
    }
  }
  html,
  html * {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 0px;
    box-sizing: border-box;
  }
  html p,
  html a,
  html ul,
  html ol,
  html li {
    font-size: 16px;
  }
  body {
    margin: 5px;
  }
  *,
  *:before,
  *:after {
    box-sizing: inherit;
  }
  form.centeredForm {
    position: relative;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  form.centeredForm &gt; fieldset {
    border-width: 5px;
    border-style: solid;
    border-color: #d3d3d3;
    border-collapse: collapse;
    padding: 10px;
  }
  form.centeredForm &gt; fieldset &gt; legend {
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
  }
  .centeredForm .formEntry {
    display: block;
    margin: 5px;
  }
  .centeredForm .formEntry.submit,
  .centeredForm .formEntry.button {
    text-align: right;
  }
  .centeredForm .formEntry.hidden {
    display: none;
    width: auto;
  }
  .centeredForm .formEntry.spacer {
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    display: block;
  }
  .centeredForm .formEntry &gt; label,
  .centeredForm .formEntry &gt; input,
  .centeredForm .formEntry &gt; div {
    display: inline-block;
    padding: 0.125em 0.375em 0.1875em 0.375em;
  }
  .centeredForm .formEntry &gt; label {
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
    width: 40%;
    vertical-align: baseline;
  }
  .centeredForm .formEntry:not(.hidden) &gt; input,
  .centeredForm .formEntry.optionList &gt; div,
  .centeredForm .formEntry.select &gt; div,
  .centeredForm .formEntry.radio &gt; div {
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    width: 60%;
  }
  .centeredForm .formEntry.submit &gt; input,
  .centeredForm .formEntry.button &gt; input {
    width: 30%;
  }
  .centeredForm .formEntry:not(.submit):not(.button):not(.hidden) {
    text-align: right;
  }
  .centeredForm .formEntry.optionList .optionListMainContainer {
    -webkit-column-width: auto;
    -webkit-column-count: 3;
    -webkit-column-gap: 0;
    -webkit-column-rule: none;
    -moz-column-width: auto;
    -moz-column-count: 3;
    -moz-column-gap: 0;
    -moz-column-rule: none;
    column-width: auto;
    column-count: 3;
    column-gap: 0;
    column-rule: none;
  }
  .centeredForm .formEntry.optionList .optionListMainContainer,
  .centeredForm .formEntry.optionList .optionListMainContainer * {
    text-align: left;
    padding: 0.125em 0.375em 0.1875em 0.375em;
  }
  .centeredForm .formEntry.optionList .optionListMainContainer .optionListTitleContainer {
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
    display: block;
    margin-top: 0.625em;
    margin-bottom: 0.1875em;
    -webkit-column-span: all;
    -moz-column-span: all;
    column-span: all;
    z-index: 0;
  }
  .centeredForm .formEntry.optionList .optionListMainContainer .optionListTitleContainer:first-child {
    margin-top: -1.525em;
  }
  .centeredForm .formEntry.optionList .optionListMainContainer .optionListContainer {
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    width: 100%;
    padding: 0px !important;
  }
  .centeredForm .formEntry.select .selectMainContainer {
    text-align: left;
    padding: 0px !important;
  }
  .centeredForm .formEntry.radio .radioMainContainer {
    -webkit-column-width: auto;
    -webkit-column-count: 3;
    -webkit-column-gap: 0;
    -webkit-column-rule: none;
    -moz-column-width: auto;
    -moz-column-count: 3;
    -moz-column-gap: 0;
    -moz-column-rule: none;
    column-width: auto;
    column-count: 3;
    column-gap: 0;
    column-rule: none;
    text-align: left;
    padding: 0px !important;
  }
  .centeredForm .formEntry.radio .radioMainContainer .radioContainer {
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    width: 100%;
    padding: 0px !important;
  }
  .centeredForm div.formEntry:nth-of-type(2n) {
    color: black;
    background-color: #f5f5ff;
  }
  /*
   * @CSS3 Inputs
   * @author kellers
   **/
  
  :root input {
    -moz-border-radius-topleft: 0.5em;
    -moz-border-radius-topright: 0.5em;
    -moz-border-radius-bottomright: 0.5em;
    -moz-border-radius-bottomleft: 0.5em;
    -webkit-border-top-left-radius: 0.5em;
    -webkit-border-top-right-radius: 0.5em;
    -webkit-border-bottom-right-radius: 0.5em;
    -webkit-border-bottom-left-radius: 0.5em;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
    border-bottom-left-radius: 0.5em;
    border-width: 1px;
    border-style: solid;
    border-color: #cccccc;
    border-collapse: collapse;
    outline: 0px none;
    vertical-align: baseline;
    padding: 0.125em 0.375em 0.1875em 0.375em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  :root input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="reset"]):not([type="submit"]):not([type="button"]).ui-spinner-input {
    margin: 0px 17px 0px 0px;
  }
  :root input[type="color"] {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  :root span.ui-spinner.ui-widget {
    font-size: inherit !important;
  }
  :root input[type=number] {
    text-align: right;
  }
  :root input[disabled] {
    color: #545454 !important;
    -moz-opacity: .4;
    -webkit-opacity: .4;
    opacity: .4;
  }
  :root input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="reset"]) {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  }
  :root input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="reset"]):not([disabled]):focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  }
  :root div[data-type="button"] {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  }
  :root div[data-type="button"]:not([data-disabled]):focus,
  :root div[data-type="button"]:not([data-disabled]):hover {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  }
  :root button:not([data-disabled]):not(.ui-datepicker-close):not(.ui-datepicker-current):not(.ui-button) {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  }
  :root button:not([data-disabled]):not(.ui-datepicker-close):not(.ui-datepicker-current):not(.ui-button):not([data-disabled]):focus,
  :root button:not([data-disabled]):not(.ui-datepicker-close):not(.ui-datepicker-current):not(.ui-button):not([data-disabled]):hover {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  }
  :root input[type="button"]:not([disabled]):hover,
  :root input[type="submit"]:not([disabled]):hover {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6) !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6) !important;
  }
  :root input[type="submit"],
  input[type="button"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: black;
    background-color: #f8f8f8;
  }
  :root input[type="submit"]:active,
  input[type="button"]:active {
    border-width: 1px;
    border-style: inset;
    border-color: #808080;
    border-collapse: collapse;
  }
  :root div[data-type="button"],
  :root input[type="button"] {
    margin: -1px -1px -1px -3px;
  }
  :root div[data-type="button"],
  :root input[type="button"],
  :root div[data-type="button"]:root button:not(.ui-datepicker-close):not(.ui-datepicker-current):not(.ui-button),
  :root input[type="button"]:root button:not(.ui-datepicker-close):not(.ui-datepicker-current):not(.ui-button) {
    min-width: 5px;
    line-height: 1;
    display: inline-block;
  }
  :root button:not(.ui-datepicker-close):not(.ui-datepicker-current):not(.ui-button) {
    margin: -1px -1px -1px 1px;
  }
  /**
   * @info Cross-browser CSS3 Image-Free Custom Checkbox
   * @author Dmitriy Kubyshkin
   * @changed by kellers
   * @web http://kubyshkin.ru/posts/cross-browser-css3-image-free-custom-checkbox.html
   */
  
  .my_own_styled_checkbox {
    position: relative;
    display: inline-block;
    zoom: 1;
  }
  .my_own_styled_checkbox * {
    font-size: inherit !important;
  }
  .my_own_styled_checkbox .checkBox,
  .my_own_styled_checkbox .checkBoxOverlay {
    padding: 0px !important;
    box-sizing: content-box;
  }
  .my_own_styled_checkbox .checkBox {
    position: absolute;
    display: inline-block;
    top: 0.125em;
    width: 1em;
    height: 1em;
    border-width: 1px;
    border-style: solid;
    border-color: #cccccc;
    border-collapse: collapse;
    background-color: white;
    -moz-border-radius-topleft: 50%;
    -moz-border-radius-topright: 50%;
    -moz-border-radius-bottomright: 50%;
    -moz-border-radius-bottomleft: 50%;
    -webkit-border-top-left-radius: 50%;
    -webkit-border-top-right-radius: 50%;
    -webkit-border-bottom-right-radius: 50%;
    -webkit-border-bottom-left-radius: 50%;
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    vertical-align: bottom;
    vertical-align: text-bottom;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  }
  .my_own_styled_checkbox &gt; input {
    cursor: pointer;
  }
  .my_own_styled_checkbox &gt; input[disabled] {
    cursor: default;
  }
  .my_own_styled_checkbox &gt; input[disabled] + .checkBox {
    border-width: 1px;
    border-style: solid;
    border-color: #eeeeee;
    border-collapse: collapse;
    background-color: #eee;
  }
  .my_own_styled_checkbox &gt; input[disabled] + .checkBox &gt; .checkBoxOverlay {
    border-bottom: 0.125em solid #999;
    border-left: 0.125em solid #999;
  }
  .my_own_styled_checkbox &gt; input[disabled] + .checkBox + span.checkBoxText {
    color: #999;
  }
  .my_own_styled_checkbox .checkBox &gt; .checkBoxOverlay {
    position: absolute;
    display: none;
    border-bottom: 0.15em solid black;
    border-left: 0.15em solid black;
  }
  .my_own_styled_checkbox input:checked + .checkBox &gt; .checkBoxOverlay {
    left: 0.125em;
    top: 0em;
    width: 1em;
    height: 0.375em;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    zoom: 1;
    display: block;
    z-index: 2;
  }
  .my_own_styled_checkbox input {
    position: absolute;
    outline: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: none;
    margin: 0;
    z-index: 3;
    opacity: 0;
  }
  .my_own_styled_checkbox &gt; input:not([disabled]):active + .checkBox,
  .my_own_styled_checkbox &gt; input:focus + .checkBox {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  }
  .my_own_styled_checkbox &gt; input:focus + .checkBox,
  .my_own_styled_checkbox &gt; input:not([disabled]):hover + .checkBox {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  }
  .my_own_styled_checkbox &gt; span.checkBoxText {
    display: block;
    vertical-align: top;
    margin-left: 1.5em !important;
    word-break: break-all;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="userEdit view-size-100p"&gt;
    &lt;div class="userEdit"&gt;
      &lt;div class="mainDiv"&gt;
  
        &lt;form class="centeredForm centeredForm" action="" method="post" enctype="multipart/form-data"&gt;
          &lt;fieldset&gt;
            &lt;legend&gt;some title&lt;/legend&gt;
            &lt;div class="centeredForm formEntry optionList"&gt;
              &lt;label&gt;some label text&lt;/label&gt;
              &lt;span style="display: inline-block;width: 60%;margin:0px;padding:0px;visibility: hidden;"&gt;&amp;nbsp;&lt;/span&gt;
              &lt;div class="centeredForm optionListMainContainer" style="margin-top: -1.525em;"&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" checked="checked" tabindex="21"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" tabindex="22"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" checked="checked" tabindex="23"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" tabindex="24"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" checked="checked" tabindex="25"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" tabindex="26"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" checked="checked" tabindex="27"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" tabindex="28"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" checked="checked" tabindex="29"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
                &lt;span class="centeredForm optionListContainer my_own_styled_checkbox"&gt;
       &lt;input type="checkbox" name="ckeckboxname[]" value="5" tabindex="30"&gt;&lt;span class="centeredForm checkBox"&gt;&lt;span class="centeredForm checkBoxOverlay"&gt;&lt;/span&gt;&lt;/span&gt;
                &lt;span class="centeredForm checkBoxText"&gt;Test User&lt;/span&gt;
                &lt;/span&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;span class="centeredForm formEntry submit"&gt;
     &lt;input type="submit" name="pEditSingleUserGroup" value="some action" tabindex="32"&gt;
    &lt;/span&gt;
          &lt;/fieldset&gt;
        &lt;/form&gt;
  
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>