Monday, 15 August 2011

html - Bootstrap- How to use horizontal form layout with prepend text? -



html - Bootstrap- How to use horizontal form layout with prepend text? -

i have been trying utilize horizontal form layout below:

class="lang-none prettyprint-override">enter email: [field] come in password: [prepend+field]

i've been trying hr couldn't find solution. please tell how can that. have tried:

class="lang-html prettyprint-override"><form class="form-horizontal"> <!--<span class="offset2">sign email</span>--> <div class="control-group"> <div class="controls"><span>welcome email</span></div> </div> <div class="control-group input-append"> <label for="emailid" class="control-label">email id</label> <div class="controls"> <input type="text" /> <span class="add-on">@</span> </div> </div> <div class="control-group input-append"> <label for="passwd" class="control-label">password</label> <div class="controls"> <input type="password" /> <span class="add-on">***</span> </div> </div> <div class="control-group"> <div class="controls" > <label class="checkbox"> <input type="checkbox" />remember me </label> <button class="btn">sign in</button> </div> </div> </form>

you're looking form-inline class.

you can utilize css add together spacing between form groups:

.form-inline .form-group { margin-right: 10px; }

html css twitter-bootstrap

No comments:

Post a Comment