css - Boostrap 3 input with addon and help block -

using bootstrap css 3.3.1, got little problem input addon , block.

just see fiddle : https://jsfiddle.net/l8cyqol1/1/

tested on firefox / chrome. markup wrong ? tried "input-group" ... class without success

here markup :

<div class="form-group">     <label for="title" class="control-label col-md-3">titre de la page</label>     <div class="col-md-9 input-group">         <div class="input-group-addon">             @         </div>         <input type="text" value="value test" class="form-control input-xxlarge" id="title" name="title" size="46" />             <span class="help-block">help lorem ipsum</span>     </div> </div> 

try this:

<div class="form-horizontal">     <div class="form-group">         <label for="title" class="control-label col-sm-3">titre de la page</label>         <div class="col-sm-9">             <div class="input-group">               <span class="input-group-addon">@</span>                 <input type="text" id="title" name="title"  class="form-control" />             </div>             <p class="help-block">example block-level text here.</p>         </div>     </div> </div> 

see this updated fiddle

(stretch preview pane see column support)