Display in CentreRSS

6 replies

Last post Sep 09, 2019 04:46 AM by shaili shah

‹ Previous Thread|Next Thread ›

Shortcuts

- Reply
jsshivalik
Member

108 Points

381 Posts

Display in Centre

Jun 24, 2019 07:53 AM|jsshivalik|LINK

Hi

In below code i want to display Save in centre

<div class="row">
<div class="form-group col-md-12">
<asp:Button ID="btnSave" runat="server" class="btn btn-primary" Text="Save" OnClick="btnSave_Click"/>

</div>
</div>

Thanks

Yang Shen

Participant

1760 Points

570 Posts

Re: Display in Centre

Jun 24, 2019 08:35 AM|Yang Shen|LINK

Hi jsshivalik,

If you want to center the Save button relative to the outer div, you can use ‘text-align: center’ in CSS.

Please refer to below codes:

<head runat="server">
    <title></title>
    <style type="text/css">
        .col-md-12 {
            text-align:center;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div class="row">
            <div class="form-group col-md-12">
                <asp:Button ID="btnSave" runat="server" class="btn btn-primary" Text="Save"  />
            </div>
        </div>
    </form>
</body>

Here is result of my demo:

Best Regard,

Yang Shen

- Reply
jsshivalik
Member

108 Points

381 Posts

Re: Display in Centre

Jun 24, 2019 04:42 PM|jsshivalik|LINK

Hi Yang

I want size should also be col-md-4

Thanks

Yang Shen

Participant

1760 Points

570 Posts

Re: Display in Centre

Jun 25, 2019 01:34 AM|Yang Shen|LINK

Hi jsshivalik,

I'm sorry that i can't understand your question. Whose size do you want to change, or do you want to add a div with its class="col-md-4"?

If so, please refer to below codes:

<head runat="server">
    <link href="Content/bootstrap.min.css" rel="stylesheet" />
    <title></title>
    <style type="text/css">
        .col-md-12 {
            text-align: center;
            width:100%;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div class="row">
            <div class="form-group col-md-12">
                <div class="form-group col-md-4">
                <asp:Button ID="btnSave" runat="server" class="btn btn-primary" Text="Save" />
                    </div>
            </div>
        </div>
    </form>
</body>

Notice: You can check the style by selecting it, right-clicking on 'Go To Definition' and entering bootstrap. min. CSS to see the details of the style. And in your page, you can override this style.

Here's result of my demo:

Best Regard,

Yang Shen

- Reply
ifour.parth@...
Member

10 Points

27 Posts

Re: Display in Centre

Jun 27, 2019 04:11 AM|ifour.parth@gmail.com|LINK

<div class="row">
<div class="form-group col-md-12">
<asp:Button ID="btnSave" runat="server" class="btn btn-primary" Text="Save" OnClick="btnSave_Click" style="text-align:center"/>
</div>
</div>

Blockchain software companies india
http://www.ifourtechnolab.com/blockchain-technology
- Reply
shaili shah
Member

10 Points

24 Posts

Re: Display in Centre

Sep 09, 2019 04:43 AM|shaili shah|LINK

<div class="row">
<div class="form-group col-md-12">
<asp:Button ID="btnSave" runat="server" class="btn btn-primary center" Text="Save" OnClick="btnSave_Click"/>

</div>
</div>

<style>

.center{

text-align:center;

}

</style>

ASP.NET consulting companies india
https://www.ifourtechnolab.com/asp-dot-net-enterprise-content-management
- Reply
shaili shah
Member

10 Points

24 Posts

Re: Display in Centre

Sep 09, 2019 04:46 AM|shaili shah|LINK

<div class="row">
<div class="form-group col-md-12">
<asp:Button ID="btnSave" runat="server" class="btn btn-primary center" Text="Save" OnClick="btnSave_Click"/>

</div>
</div>

<style>

.center{

text-align:center;

}

</style>

ASP.NET consulting companies india
https://www.ifourtechnolab.com/asp-dot-net-enterprise-content-management

‹ Previous Thread|Next Thread ›