가로로 정렬 다른 테이블에있는 두 개의 테이블

Question

나는 테이블과 그 안에 두 개의 다른 테이블을 가지고 있습니다. 문제는 가로로 정렬되지 않는다는 것입니다. 헤더를 같은 줄에서 시작하고 싶습니다.

<TABLE CELLPADDING="10" > 
    <tr> 
    <td> 
    <!--This is Process Info Table--> 
    <table border="1" > 
     <tr bgcolor="#006699"> 
      <th colspan="2" ALIGN="LEFT">Process Info:</th> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Product Name:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/ProductName"/></td> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Process Window Name:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/ProcessWindowName"/></td> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Oven Recipe Name:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/OvenRecipeName"/></td> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Conveyor Speed Units:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/ConveyorSpeedUnits"/></td> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Temperature Scale:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/TemperatureScale"/></td> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Number of TCs:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/NumberOfTCs"/></td> 
     </tr> 
     <tr> 
      <td style='padding:2px 100px 2px 2px'>Number of Statistics:</td> 
      <td style='padding:2px 100px 2px 2px'><xsl:value-of select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/ProcessInfo/NumberOfStatistics"/></td> 
     </tr> 
    </table> 
    </td> 
    <td> 
    <!--This is Statistics Limits Table--> 
    <table border="1" > 
     <tr bgcolor="#006699"> 
      <th ALIGN="LEFT">Statistics Limits:</th> 
      <th ALIGN="LEFT">Low</th> 
      <th ALIGN="LEFT">Target</th> 
      <th ALIGN="LEFT">High</th> 
     </tr> 
     <xsl:for-each select="GeneralReflowProcessReport/Results/GeneralReflowProcessReportEntry/StatisticsLimits/Statistics/StatsticsEntries"> 
      <tr> 
       <td style='padding:2px 100px 2px 2px'><xsl:value-of select="StatisticsLimitsName"/></td> 
       <td style='padding:2px 20px 2px 2px'><xsl:value-of select="Low"/></td> 
       <td style='padding:2px 20px 2px 2px'><xsl:value-of select="Target"/></td> 
       <td style='padding:2px 20px 2px 2px'><xsl:value-of select="High"/></td> 
      </tr> 
     </xsl:for-each> 
    </table> 

     </td> 
    </tr> 
    </TABLE> 

감사합니다.

Answer 1

테이블이 포함 된 <td> 요소에 valign="top"을 추가하기 만하면됩니다.

참조 : http://jsfiddle.net/Wexcode/z8Q5W/