Geek Answers Handbook

Bootstrap buttons added dynamically look different than those declared in the markup

As the title says.

I have this markup:

.spancenter {
    margin:0 auto !important; 
    float:none !important;
    text-align:center !important;
}

<div class="row-fluid">
    <div class="span12">
        <div class="spancenter">
            <input id="btnSave" name="btnSave" class="btn" type="button" value="Save" />
            <input id="btnCancel" name="btnCancel" class="btn" type="button" value="Cancel" />
        </div>
    </div>
</div>

If I get this HTML via AJAX (i.e. literally say $('#divWrapper').html(thehtml);, it looks different:

enter image description here

(top of AJAX, bottom - static markup)

In Firebug they look the same.

Why do they look different?

+4
source share
1 answer

Inputs are built-in elements, so in HTML, as in the above example, there will be a space between them. There are several ways to get rid of it, and one of them is to write HTML without spaces, for example.

<input type="button"
/><input type="button" />

or

<input type="button" /><input type="button" />

AJAX, , , . .

- . - , .

+1

More articles:


All Articles