Créer un texte et un bouton dans la même ligne avec Bootstrap
Je suis l'aide de la base de téléchargement de fichier bootstrap-fileupload.js pour me donner un nom de fichier et le bouton et pour répéter le format de saisie de texte et un bouton.
<div class="form-group">
<label class="control-label">Source File Name</label>
<div class="fileupload fileupload-new" data-provides="fileupload">
<div class="input-group">
<div class="form-control uneditable-input"><i class="icon-file fileupload-exists"></i>
</div>
<div class="input-group-btn">
<a class="btn btn-default btn-file">
<span class="fileupload-new">Select file</span>
<span class="fileupload-exists">Change</span>
<input type="file" class="file-input"/></a>
<a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remove</a>
</div>
</div>
</div>
</div>
<form id="frmOptions" method="post" class="form-inline span12">
<div class="row-fluid">
<div class="form-group">
<label class="control-label">File Name on Upload</label>
<div class="input-group ">
<input id="uploadname" type="text" class="form-control">
<a class="btn btn-default go inline">Upload to DocMan</a>
</div>
</div>
</div>
</form>
Page hébergée ici https://googledrive.com/host/0B90FGJizRd-gbm1JRUswYUY5dE0/bootstrap/
J'ai essayé des variantes de ce avec aucun effet. Fondamentalement, je veux deux semblable à la recherche de largeur lignes, chacune avec un champ de texte et un bouton. Tous les conseils bienvenus.
source d'informationauteur DavidF
Vous devez vous connecter pour publier un commentaire.
Essayez ceci:
Html résultant:
Vous utilisez l'entrée du groupe
Vous pouvez l'envelopper dans une div avec la "navbar-forme" de la classe. Que de tout mettre à l'intérieur de la ligne.
Une option est de remplacer la
display:block;
style de la classe forme de contrôle. J'ai posté un exemple de code dans la réponse suivante:bootstrap: aligner d'entrée avec bouton