4 Replies Latest reply: Apr 7, 2013 4:01 PM by Nancy O. RSS

    Table column uneven shift-needing advice

    OOlala_28 Community Member

      Hello all!

       

      I am having an issue with a table column that shifts unevenly to the top when viewing from FireFox. I noticed that this occured as soon as I added divs for my text headers.

      I read a lot of posts relating to the issue and learned that merging and/or splitting cells is a malpractice, which I have done prior to my findings.

       

      In my attempts at resolving the problem, I have deleted all height values and now I'm faced with a couple of options: Either I create CSS rules for setting table properties or I recreate cells that will have nested tables in them that would act independently? Is this correct?

       

      Could you please tell me what the best course of action is?

       

      Your advice will be muchly appreciated!!!

      Thank you.

       

      Da CODE:

       

       

      <table width="800" height="1000" border="0" cellspacing="0" cellpadding="0" align="center">
        <tr>
          <td width="302"><table width="302" border="0" valign="center" align="center" cellpadding="0" cellspacing="0">
            <tr width="302">
              <td width="302" colspan="3" align="center" valign="middle" border="0" cellspacing="0" cellpadding="0"><img src="Images/About_original_01.jpg" width="302" height="501" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
            </tr>
            <tr width="302">
              <td width="105" border="0" cellspacing="0" cellpadding="0"><img src="Images/About_original_08.jpg" width="105" height="53" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
              <td width="75" border="0" cellspacing="0" cellpadding="0"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','Images/About_original_09.jpg',1)"><img src="Images/About_original_resume_OR_09.jpg" name="Image3" width="75" height="53" hspace="0" vspace="0" border="0" valign="center" align="middle"></a></td>
              <td width="122" border="0" cellspacing="0" cellpadding="0"><img src="Images/About_original_10.jpg" width="122" height="53" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
            </tr>
            <tr align="center" valign="middle" width="302" border="0" cellspacing="0" cellpadding="0">
              <td width="302" colspan="3" border="0" cellspacing="0" cellpadding="0"><img src="Images/About_original_11.jpg" width="302" height="446" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
            </tr>
          </table></td>
          <td width="498" border="0" cellspacing="0" cellpadding="0" valign="middle" align="center"><table width="498" height="1000" border="0" cellspacing="0" cellpadding="0" align="center" valign="center">
            <tr align="center" valign="middle" border="0" cellspacing="0" cellpadding="0">
              <td width="498" colspan="4" border="0" cellspacing="0" cellpadding="0"><img src="Images/About_original_02.jpg" width="498" height="19" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
            </tr>
            <tr border="0" cellspacing="0" cellpadding="0" valign="center">
              <td width="158" align="center" valign="middle" border="0" cellspacing="0" cellpadding="0"><img src="Images/About_original_03.jpg" width="158" height="67" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
              <td width="65"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','Images/About_original_rollover_04.jpg',1)"><img src="Images/About_original_04.jpg" name="Image8" width="65" height="67" hspace="0" vspace="0" border="0" valign="center" align="middle"></a></td>
              <td width="167" border="0" cellspacing="0" cellpadding="0" valign="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image11','','Images/About_original_rollover_05.jpg',1)"><img src="Images/About_original_05.jpg" name="Image11" width="167" height="67" hspace="0" valign="center" vspace="0" border="0" align="middle"></a></td>
              <td width="108" border="0" cellspacing="0" cellpadding="0" valign="center"><img src="Images/About_original_06.jpg" width="108" height="67" hspace="0" vspace="0" border="0" align="middle" valign="center"></td>
            </tr>
            <tr align="center" valign="middle" border="0" cellspacing="0" cellpadding="0">
              <td width="498" colspan="4" border="0" cellspacing="0" cellpadding="0"><div class="aboutimagecontainer"><img src="Images/About_original_07.jpg" width="498" height="914" hspace="0" valign="center" vspace="0" align="middle" border="0"> 
              <p class="aboutheader"> Here is my story </p>
               <p class="aboutsubheader"> in short </p>
              </div>
                </td>
            </tr>
          </table></td>
        </tr>
      </table>
      
      </body>
      </html>