IP Girl
  1. IP Girl
  3. Bootstrap 3 – x-input (plus petit que sm)
Intereting Posts
Perl expression régulière (en utilisant une variable comme chaîne de recherche avec les caractères d’opérateur Perl inclus) Trouver la version OpenCV installée sur Ubuntu Comment changer l’opacité (alpha, transparence) d’un élément dans un élément canvas après qu’il ait été dessiné? Etat de la liste d’état pouvant être dessiné et désactivé Quelles sont les ressources pour apprendre le Lambda Calculus? Pourquoi devrais-je utiliser log.Println au lieu de fmt.Println? Bon exemple de livelock? concevoir une stack telle que getMinimum () soit O (1) Sublime text 2 – comment classer alphabétiquement une liste de mots (DESC / ASC) La version Java passe automatiquement à java 1.5 après la mise à jour de maven Peut-on faire un pour chaque boucle en Java dans l’ordre inverse? Code pour un simple compte à rebours JavaScript? Changer l’espacement des graduations sur l’axe d’une plot? Type de données pair / tuple dans Go Comment compter les caractères d’une chaîne Unicode dans C

Bootstrap 3 – x-input (plus petit que sm)

J’ai perdu beaucoup de temps à chercher un moyen de créer ma propre taille de xs (plus petite que la petite) pour le groupe d’entrée et de saisie, voici donc le code!

Mise à jour 2014/11/14

Peter Butkovic télécharge le bug / demande sur le github bootstrap:
https://github.com/twbs/bootstrap/issues/15107

avec la réponse suivante du leur:

Nous ne l’appendons pas à la v3 et je ne pense pas que nous aurons les boutons xs même dans la v4, mais je le garderai à l’esprit si nous choisissons de le conserver.

Pour les entrées plus petites: 

.input-xs { height: 22px; padding: 2px 5px; font-size: 12px; line-height: 1.5; /* If Placeholder of the input is moved up, rem/modify this. */ border-radius: 3px; }

Exemple d’utilisation en groupe d’entrée:

Sinon, vous pouvez append une classe au groupe d’entrée comme celui-ci: 

 .input-group-xs>.form-control, .input-group-xs>.input-group-addon, .input-group-xs>.input-group-btn>.btn { height: 22px; padding: 1px 5px; font-size: 12px; line-height: 1.5; }

et utilise: 

 
        
 
 .input-xs { height: 22px!important; padding: 2px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; } .input-group-xs>.form-control, .input-group-xs>.input-group-addon, .input-group-xs>.input-group-btn>.btn { height: 22px; padding: 1px 5px; font-size: 12px; line-height: 1.5; }

Si vous utilisez bootstrap-sass , vous pouvez exploiter le mixin de input-size : 

 $input-height-xs: 27px; // adjust it according to your theme. @include input-size('.input-xs', $input-height-xs, $padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $input-border-radius-small);