How can i vertically and horizontally center an asp button in bootstrap

Question

I am trying to centre an asp button in the very centre of a div. I have managed to centre the button horizontally and vertically, but not at the same time. I have been through several other similar questions yet none of the solutions work for me.

        <div class="container" style="border: solid red 1px;">
        <div class="row">
            <span class="col-md-3 Suggestions">Feel free to send any suggestions to the site</span>
            <asp:TextBox ID="Suggestions" CssClass="Suggestions col-md-7 suggestionsBox" runat="server">Enter your suggestions here</asp:TextBox>
            <div class="text-center col-md-2 suggestionsSubmitParent">
                <asp:Button runat="server" CssClass="suggestionsSubmit" Text="Submit" ID="btnSubmit" />
            </div>
        </div>
        <div class="row">
            <span class="col-md-3 suggestionsName">Please enter your name</span>
            <asp:TextBox ID="SuggestionsName" CssClass="col-md-7 suggestionsName" runat="server">Enter your suggestions here</asp:TextBox>

        </div>
    </div>

CSS

.Suggestions {
    text-align:center;
    margin-top: 15px;   
}

.suggestionsBox {
    height: 140px;
}
.suggestionsName{
    margin-top:10px;
}

.suggestionsSubmit {
    width: 80px;
}
.suggestionsSubmitParent {
    height: 155px;
    display: flex;
    align-items: center;

Possible duplicate of [How can I center vertically a bootstrap class button?](https://stackoverflow.com/questions/22242447/how-can-i-center-vertically-a-bootstrap-class-button) — Junaid, Jun 24 '17 at 01:07
Yes I already read that, as I stated no solutions I found were working for me — Andy Stevens, Jun 24 '17 at 01:27
Is your APP live? Can we test it and see why it isn't working? — Junaid, Jun 24 '17 at 01:32

score 0 · Accepted Answer · answered Jun 24 '17 at 02:43

0

Add justify-content:center; to your .suggestionsSubmitParent css class.

answered Jun 24 '17 at 02:43

Kosh

16,966
2
19
34

How can i vertically and horizontally center an asp button in bootstrap

1 Answers1