CODEWITHSUNDEEP
htmltwitter-bootstrap
David
David

Reputation: 67

*Solve* How to align the close button in bootstrap popup modal

I have a simple bootstrap popup modal. Right now when the popup appear, the close x button is at center and I want to align the close button x to the right corner of the popup window. How can I do this?

<div class="modal fade" id="checkNameSurvey-modal" data-backdrop="static" data-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <div class="loginmodal-container" id="checkNameSurveymodal-container">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h4 style="text-align:center"></h4><br>
            <div>
                <input type="text" class="form-control login-input" id="newSurveyName" onkeyup="if(event.keyCode==13)document.getElementById('checkName-button').click()">

                <button  type="button" class="btn btn-primary" id="checkName-button"></button>

            </div>
        </div>
    </div>
</div>

Upvotes: 0

Views: 6634

Answers (3)

AB Udhay
AB Udhay

Reputation: 753

Try using 'modal-header', 'modal-content' classes. Go through UI DIALOGS

here inspect element in the modal.

Upvotes: 2

David
David

Reputation: 67

sorry, I found a mistake, the close x button is align at the center because I put it inside of my class "loginmodal-container" which I have a stylesheet of center. So I fix that problem. Thank you

Upvotes: 0

NoviceCoder
NoviceCoder

Reputation: 319

You can use float:right. That might shift the cross button to the right side.

Sharing a screenshot of the modal box would have been more helpful.

Upvotes: 2

Related Questions