2 Replies Latest reply: Apr 18, 2013 3:39 PM by Timber%% RSS

    Table Centering

    Timber%% Community Member

      How to I center the table? I put in this line into the table area

      <table style="margin: auto;"

      However the table leans towards the right. If I can get the table to fall evenly below the navigation bar that would help. 

      The lines in the table header can those divider lines be selectively removed? Thanks

       

      ___________________

       

      <!doctype html>

      <html>

      <head>

      <meta charset="utf-8">

      <title>Library Page Ten</title>

       

      <!--[if lt IE 9]>

      <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

      <![endif]-->

       

      <style>

      body {

          width: 720px;

          margin: 0 auto;

          background-image: url(../../images/backgrounds/fade_bl_BigBaba_Stamps.png);

          background-repeat: repeat;

      }

       

      nav {

      width: 720px;

      margin:0 auto;

      overflow: hidden; /*to control floats*/

      }

       

      nav ul { margin: 0; padding:0 }

       

      nav li {

      margin: 0;

      padding: 0;

      list-style: none;

      float: left;

      font-size: 14px;

      font-variant: small-caps;

      font-weight:bold;

      }

       

      nav li a {

      margin: 0;

      display: block;

      text-decoration: none;

      color: #000;

      width: 120px;

      line-height: 2em;

      text-align: center;

      /**gradients for various browsers**/

      background: rgb(232,240,175); /* Old browsers */

      background: -moz-linear-gradient(left, rgba(232,240,175,1) 0%, rgba(232,240,175,1) 0%, rgba(162,218,178,1) 53%, rgba(150,218,209,1) 98%); /* FF3.6+ */

      background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(232,240,175,1)), color-stop(0%, rgba(232,240,175,1)), color-stop(53%, rgba(162,218,178,1)), color-stop(98%, rgba(150,218,209,1))); /* Chrome,Safari4+ */

      background: -webkit-linear-gradient(left, rgba(232,240,175,1) 0%, rgba(232,240,175,1) 0%, rgba(162,218,178,1) 53%, rgba(150,218,209,1) 98%); /* Chrome10+,Safari5.1+ */

      background: -o-linear-gradient(left, rgba(232,240,175,1) 0%, rgba(232,240,175,1) 0%, rgba(162,218,178,1) 53%, rgba(150,218,209,1) 98%); /* Opera 11.10+ */

      background: -ms-linear-gradient(left, rgba(232,240,175,1) 0%, rgba(232,240,175,1) 0%, rgba(162,218,178,1) 53%, rgba(150,218,209,1) 98%); /* IE10+ */

      background: linear-gradient(to right, rgba(232,240,175,1) 0%, rgba(232,240,175,1) 0%, rgba(162,218,178,1) 53%, rgba(150,218,209,1) 98%); /* W3C */

      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8f0af', endColorstr='#96dad1', GradientType=1 ); /* IE6-9 */

      Color format: Comments IE9 Supp

      }

       

      nav li a:hover, nav li a:active, nav li a:focus {

      text-decoration: none;

      background: #E8F0AF;

      filter:none;

      }

       

      /**clear floats after nav**/

      nav:after {

      clear: left;

      display: block;

      }

      </style>

      <script src="/pickle/pickle.js" language="javascript"></script>

      <link href="/pickle/skins/default/_stylesheet.css" rel="stylesheet" type="text/css" />

       

      <style type="text/css">

      <!--

      table, th, td {

          border: 1px solid #000000;

          border-collapse: collapse;

          color: #FFFFFF;

          background: #FFFFFF url(../../images/3fade_bl_.jpg);

      }

      th {

          color: #FF9933;

          background: #FFFFFF;

      }

      tr.altRow td {

          background: #FFFFFF;

      }

      th, td {

          vertical-align: top;

          padding: 5px;

          background-color: #FFFFFF;

      }

      .rightalign {

          text-align: right;

          color: #000000;

          font: normal 12px/normal Geneva, Arial, Helvetica, sans-serif;

          text-transform: none;

      }

      .style4 {color: #000000; font-size: 12px; }

      .style5 {color: #333333; font-size: 10px; }

      .style6 {color: #0099CC}

      .style8 {color: #999933}

      -->

      </style>

       

      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

      <script type="text/javascript">

      <!--

      function MM_preloadImages() { //v3.0

        var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

          var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

          if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

      }

      //-->

      </script>

      </head>

       

      <body>

      <header><img src="http://www.meherbabalibrary.com/logos/Logo10.png" alt="logo" height="128" width="720"> </header>

      <nav>

      <ul class="style13">

      <li><a href="../../index.htm">Baba's Home</a></li>

      <li><a href="../../kalki.htm">Kalki's Kitchen</a></li>

      <li><a href="../../dvdrent.htm">Fana Fillah</a></li>

      <li><a href="../../jive.htm">Curator's Jive</a></li>

      <li><a href="../../advent.htm">Advent Vault</a></li>

      <li><a href="../../babasplash.htm">Baba Splash</a></li>

      </ul>

      </nav>

       

      <h2> </h2>

      <h2> </h2>

      <p align="center"><img src="../../images/Summations/s3/archive_lib.png" alt="Lord Prabhu" width="336" height="41"><br>

      THIS IS ONLY A WORK AREA A TEMPLATE</p>

      <CENTER>

        <h4>Selected Materials from the Library of the Ancient One</h4>

      </center>

      <div id="container" style="background-color: bgcolor;">

      <div align="center" id="1"></div>

      <div id="2"></div>

      <div id="3"></div>

      </div>

       

      <section class="container">

      <div class="child descendant">

        <div class="descendant"></div>

      </div>

      </section>

       

      <section class="container">

      <div class="child descendant">

        <div class="descendant"></div>

      </div>

      </section>

       

       

      <div style="float:left:background-color:white"></div>

       

      <div id="content">

       

      <table border="1" cellpadding="5" cellspacing="5" bordercolor="#000000" style="margin: auto;">

       

       

        <tr>

          <th scope="col">Guest</th>

          <th scope="col"> </th>

          <th scope="col">Reviews Summations</th>

          <th scope="col">Play Audio Media</th>

        </tr>

        <tr>

          <th width="92" scope="col"><h5 class="style4">Allan Saviskas</h5></th>

          <th width="81" scope="col"><img src="../../images/agents/saviskas06.png" alt="Allan" width="68" height="90"></th>

          <th width="202" scope="col"><a href="../../docs/workamerica.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','../../images/Summations/s5/ann2mb2.png',1)"><img src="../../images/Summations/s5/ann2mb1.png" name="Image7" width="300" height="32" border="0"></a></th>

          <th width="269" scope="col"><a href="../../media/media_saviskas.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','../../images/Summations/s5/ann2mb2.png',1)"><img src="../../images/Summations/s5/ann2mb1.png" name="Image8" width="300" height="32" border="0"></a></th>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

        <tr>

          <td> </td>

          <td> </td>

          <td> </td>

          <td> </td>

        </tr>

      </table>

      <br>

      <br>

      <p> </p>

      <h2 class="style19">Work Sheet</h2>

      <p class="style19">Additional Assests Forthcoming</p>

      <h1 class="style19"><a href="list_g_lib_eight.html"><img src="../../images/Summations/s6/lib8.png" alt="eight" width="300" height="32"></a><br>

        <a href="list_g_lib_one.html"><img src="../../images/Summations/s6/lib0.png" alt="Home" width="300" height="32"></a></h1>

      <dl>

        <dd> </dd>

        </dl>

      <p> </p>

      <p class="style6"> </p>

      <p> </p>

      </div>

      <div id="Commentary">

        <h2><span class="style18">Link</span>: <br>

        

         

          Ezad </h2>

      </div>

      </body>

      </html>