Input's with bootstrap icons

html, icons, styles, twitter-bootstrap

Solution

Try this-

       <div class="input-prepend">
        <span class="add-on"><i class="icon-user icon-black"></i></span>
<input type="text" name="login" class="//Some class" placeholder="Email address"/>
         </div>

In case of appending it, Just replace `.input-prepend` with `.input-append`.

Example- http://jsfiddle.net/PYwq5/

Update bootstrap V3-

Append-

<div class="input-group">
    <input type="email" class="form-control" />
    <span class="input-group-addon">
        icon</span>
</div>

Prepend-

<div class="input-group">
    <span class="input-group-addon">
        icon</span>
    <input type="email" class="form-control" />
</div>

Demo- https://jsfiddle.net/DTcHh/9190/

Problem

I'm trying to make a button which connects to a mumble server. I'm using bootstrap for the CSS at the moment. In my quick mock up I did earlier I had this button with the headphones icon, however I can't figure out to do it as the connect button requires the tag instead of the tag. Here is a working version of the button the way i would like it styled and one of a working version of the mumble connect button. Is it possible to use the icon with the `<input>`? Styled button; ``` <button class="btn btn-large btn-primary" type="button"><i class="icon-headphones icon-white"></i> Connect to Mumble</button> ``` Connection 'button'; ``` <input class="button" value="Connect" onclick="window.location.href='mumble://MUMBLE IP HERE/?version=1.2.3'" type="BUTTON" /> ```

Original source