Problem with CSS button positioning

Question

Problem with CSS button positioning

Navigation

#1 by (1 votes)

2

Good morning! I'm having problems with the placement of a button in CSS. When the form has not yet applied any validation, it remains in the correct position, however when the validations are applied (the has-error class is added to the divs and a label appears under the field) it scrolls down, as in the image below.

WhenIinspecttheelements,Iseethatthereisapaddingonthebutton,andIbelievethatremovingpadding-topwouldsolveit,butthereisnotevenawaytoedititinthebrowsertoview.

EDIT - Code below I'm using Bootstrap 3

 <div class="form-group pesquisa">
                    <div class="col-lg-12">
                        <asp:Label
                            ID="lblCliente"
                            AssociatedControlID="txtPesquisaCliente"
                            ClientIDMode="Static"
                            Text="Cliente"
                            CssClass="col-lg-2 control-label"
                            runat="server">
                        </asp:Label>
                    </div>
                    <div class="col-lg-9">
                        <div class="input-group">
                            <asp:TextBox
                                ID="txtPesquisaCliente"
                                ClientIDMode="Static"
                                CssClass="form-control required"
                                runat="server">
                            </asp:TextBox>
                            <div class="input-group-btn">
                                <button id="btnPesquisarCliente" class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span></button>
                            </div>
                        </div>
                    </div>
   </div>

html css

asked by anonymous 22.07.2014 / 15:45

1 answer

Updating Div data from a Json file without blinking the screen Align a 'span' in the vertical center of a 'li' without changing the rest of the text

score 1 · Answer 1

Try adding this script:

$(document).ready(function() {
    if($('#someElement').hasClass('has-error')) {
        $(this).find('span').css("padding-top","0px");
    } 
});

Replace '#someElement' with the element that received the class 'has-error'.