Comment faire un centre de contrôle horizontal groupe dans le pied de page - changé dans jqm 1.1.1?

Cette habitude de travailler pour le centre de la controlgroup en version 1.1.0, mais maintenant, il semble qu'il n'est pas en 1.1.1.

<div data-theme="a" data-role="footer" style="text-align:center;">
   <div data-role="controlgroup" data-type="horizontal" data-mini="true">
      <a href="foo" data-role="button">link1</a>
      <a href="boo" data-role="button">link2</a>
   </div>
   <div class="copy">&copy; 2012 bigco</div>
</div>
J'ai dû changer mon controlgroups à boutons avec le contenu des grilles pour le moment jusqu'à ce qu'ils travaillent les bugs de jQM 1.1.1 Voir ici: jquerymobile.com/test/docs/content/content-grids.html

OriginalL'auteur tj_carroll | 2012-07-16

  1. 11

    Probablement align="center" attribut de data-role="controlgroup" div pourrait être adapté pour que.

    <div data-theme="a" data-role="footer" align="center">
   <div data-role="controlgroup" data-type="horizontal" data-mini="true">
      <a href="foo" data-role="button">link1</a>
      <a href="boo" data-role="button">link2</a>
   </div>
   <div class="copy">&copy; 2012 bigco</div>
</div>

    http://jsfiddle.net/sGFTy/1/

    OriginalL'auteur gumkins

  2. 5

    J'ai trouvé la solution sur ce site:
    http://forum.jquery.com/topic/how-to-horizontally-center-a-set-of-grouped-buttons

    Le CSS:

    #navgroup {text-align:center;}
#navgroup div {display:inline-block;}

    Le code HTML:

    <div id="navgroup">
    <div data-role="controlgroup" data-type="horizontal">
      <a href="index.htm" data-role="button" data-theme="e" data-mini="true" class="active menu">Menu</a>
      <a href="specials.htm" data-role="button" data-theme="e" data-mini="true" class="specials">Specials</a>
      <a href="howitworks.htm" data-role="button" data-theme="e" data-mini="true" class="howitworks">FAQ</a>
      <a href="http://www.facebook.com" data-rel="external" data-role="button" data-theme="e" data-mini="true"  class="feedback">Facebook</a>
    </div>
</div>
    Cela ne fonctionne pas pour moi.

    OriginalL'auteur Frank

  3. 0

    Problème persiste si l'aide
    $("sélecteur").show();
    pour afficher l'élément, car il s'applique 'display:block".

    Au lieu de l'aide .show(), utilisez maintenant
    $("sélecteur").css('display', 'inline-block');

    OriginalL'auteur Michael E.

  4. 0

    Maintenant, je suis sur JQM 1.2 et cela fonctionne pour moi...

    CSS

    .center-controlgroup { text-align: center; }

    HTML

    <div data-role="controlgroup" data-type="horizontal" class="center-controlgroup">...</div>

    OriginalL'auteur genkilabs