Thursday 15 July 2010

Bootstrap Form Horizontal alignment issue when added input append -


I'm trying to create a simple basic form, I'm unable to get that shape when the input-append class Was added to the form, whether the second input box is displayed in the same line? Thinking where is the code error? Please suggest what is causing the reason

  & lt; Body & gt; & Lt; Div class = "container" & gt; & Lt; Hours / & gt; & Lt; Form class = "form-horizontal" & gt; & Lt ;! - & lt; Span class = "offset2" & gt; Sign in to email & lt; / Span & gt; - & gt; & Lt; Div class = "control-group" & gt; & Lt; Div class = "control" & gt; & Lt; Span & gt; Welcome to my email & lt; / Span & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "control-group input-append" & gt; & Lt; Label = "emailid" class = "control-label" & gt; Email ID & lt; / Label & gt; Labels for & Lt; Div class = "control" & gt; & Lt; Input type = "text" / & gt; & Lt; Span class = "add-on" & gt; @ & Lt; / Span & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "control-group input-append" & gt; & Lt; Label = "passwd" class = "control-label" & gt; Password & lt; / Label & gt; & Lt; Div class = "control" & gt; & Lt; Input type = "password" /> & Lt; Span class = "add-on" & gt; *** & lt; / Span & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "control-group" & gt; & Lt; Div class = "control" & gt; & Lt; Label class = "checkbox" & gt; & Lt; Input type = "checkbox" /> Remember me & lt; / Labels & gt; & Lt; Button class = "btn" & gt; Sign in & lt; / Button & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Form & gt; & Lt; / Div & gt; & Lt; Script src = "js / jquery.js" & gt; & Lt; / Script & gt; & Lt; Script src = "js / bootstrap.js" & gt; & Lt; / Script & gt; & Lt; / Body & gt;    

I will just enter input-api inbound Div

  & lt; Div class = "control-group" & gt; & Lt; Div class = "input-append" & gt; & Lt; Label = "emailid" class = "control-label" & gt; Email ID & lt; / Label & gt; & Lt; Div class = "control" & gt; & Lt; Input type = "text" / & gt; & Lt; Span class = "add-on" & gt; @ & Lt; / Span & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

Check it out

. Input-append has a display: inline block hence issue

No comments:

Post a Comment