You must Sign In to post a response.
  • Category: ASP.NET

    How to align table in center

    i want to align my table in center inside a div. I can't write like this <table align=center>.iam not getting center in design
  • #767263
    try using below CSS

    #div {
    display: flex;
    justify-content: center;
    }

    #table {
    align-self: center;
    }
    //or you can use Wrapper DIV as below
    < div id="content">
    < div id="wrapper">
    < table>...< /table>
    < /div>
    < /div>

    To position horizontally center you can say width: 50%; margin: auto;. As far as I know, that's cross browser. For vertical alignment you can try vertical-align:middle;, but it may only work in relation to text. It's worth a try though.

    Thanks
    Koolprasd2003
    Editor, DotNetSpider MVM
    Microsoft MVP 2014 [ASP.NET/IIS]

  • #767269
    Hello Krishna

    try this

    < div id="content">
    <centre>
    < div id="wrapper">
    < table>...< /table>
    </centre>
    < /div>
    < /div>

  • #767288
    Hi

    You can try this below css property to align the table in center.

    < div>
    < table>
    < tr>
    < th>Name</th>
    < th>Mobile No</th>
    < th>Country</th>
    < /tr>
    < /table>

    < /div>
    < style>
    table{
    margin-left: 42%;
    border: 2px solid red;
    }
    < /style>

    Sridhar Thota.
    Editor: DNS Forum.

  • #767295
    Hi,

    May be because of your DIV it is not center aligned, if your div any one of the property is not supported for center aligned i.e. if your div align is left and your table align is center then it won't be aligned center because it inherited parent (div) properties too, so make sure about div properties too, and try the same in your browser that will help you...

    --------------------------------------------------------------------------------
    Give respect to your work, Instead of trying to impress your boss.

    N@veen
    Blog : http://naveens-dotnet.blogspot.in/

  • #768469
    1) With a class:

    <table class="centerTable"></table>

    .centerTable { margin: 0px auto; }

    2) Inline with your HTML:

    <table style="margin: 0px auto;"></table>

    Software Developer
    iFour Technolab Pvt. Ltd.

  • #768470
    You can use table align in center in HTML as given code Snippet
     <table style=" Width:554px; z-index: 100; left: 13px; position: absolute; top: 48px; background-color: #ffccff; height: 183px;"> 
    <tr>
    <td style="width: 100px">
    </td>
    <td style="width: 100px; background-color: #ffcccc">
    </td>
    <td style="width: 100px">
    </td>
    </tr>
    <tr>
    <td style="width: 100px">
    </td>
    <td style="width: 100px">
    </td>
    <td style="width: 100px">
    </td>
    </tr>
    <tr>
    <td style="width: 100px; background-color: #ffcc99">
    </td>
    <td style="width: 100px">
    </td>
    <td style="width: 100px">
    </td>
    </tr>
    </table>

    Reference Resource: http://www.dotnetfunda.com/forums/show/2387/align-table-in-center-of-page-using-html

  • #768476
    Hi,

    Yes as naveen said even if you align center due to div properties it may not effect. Make sure that.
    Try the below

    <table width="80%" border="0" align="center" style="margin-left:25%" >

    Or still if you are unable to get,share your aspx code we may suggest you any

    Hope this will help you

    Regards,
    SonyShiva
    Never lose hope..You never know what tomorrow will bring

  • #768505
    1) To center a table, we need to set the margins, like below :

    table.center {
    margin-left:auto;
    margin-right:auto;
    }

    <table class="center">
    <tr> <td>content </td></tr>
    </table>

    Mozilla and Opera will center our table very well. For IE5 and upper, we need to add one additional css as
    body {text-align:center;}

    B) Directly inside HTML tag as <table style="margin: 0px auto;"></table>

    Debasmit Samal


  • Sign In to post your comments