1

実際のテーブルは、これからお見せするモックアップよりもかなり大きいですが、このモックアップは問題を説明しています。http://www.monteandjanicechan.com/test_table.cfmにアクセスしてください。

表のグリッド ラインの太さは、HTML バージョンで思い通りになっています。ソースの表示を実行して、生成される実際の HTML を確認できます。ここで、これらの HTMl コードを format="pdf" の cfdocument タグ内に配置します。http://www.monteandjanicechan.com/test_table_pdf.cfmにアクセスしてください。くしゃみとインフルエンザのグリッド線の太さが一致していないことがわかります。私の主張をさらに説明するために、背景色を削除して PDF を生成しました。http://www.monteandjanicechan.com/test_table_pdf_nocolor.cfmにアクセスしてください。グリッド線の太さが正常に戻りました。

これにより、1 つのセルの背景色が何らかの理由でそのセルのすぐ隣のセルに影響を及ぼし、境界線を隠していると思われます。ここに奇妙なことがあります：

1) これは行スパンでのみ発生し、2 行目から残りの行スパンでのみ発生します。たとえば、最初のくしゃみは問題ありませんが、2 回目のくしゃみの境界は正しくありません。最初のインフルエンザは問題ありませんが、2 番目と 3 番目のインフルエンザの境界は正しくありません。

2) 背景色は、それ自体のセルの境界をまったくカバーしていません。すぐ隣のセルの境界を覆うだけです。

私の質問は、どうすればこの問題を解決できますか?

どんな提案や指針も大歓迎です。

4

1 に答える 1

1

厚さはHTMLバージョンでも異なります。問題はCSSルールにあると思います。

これはおそらく改善される可能性がありますが、私が望むように機能します。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>Test Table</title>
    <style type="text/css">
    td { 
        border-top: 1px solid black; 
        border-left: 1px solid black; 
    }
    .right { border-right: 1px solid black; }
    .bottom {border-bottom: 1px solid black; }
    </style>
  </head>
  <body>
<table border="0" cellspacing="0" cellpadding="5">
  <tr>

    <td class="a_style">Name</td>
    <td class="a_style">Problem</td>
    <td class="right">Treatment</td>
  </tr>
  <tr>
    <td class="b_first">Jane Doe</td>
    <td class="c_first" style="background-color:#ffff99">Cough</td>

    <td class="right" style="background-color:#ffff99">Vitamins</td>
  </tr>
  <tr>
    <td class="b">John Doe</td>
    <td class="c" style="background-color:#99FF99">Sneezing</td>
    <td class="right" rowspan="2" style="background-color:#99FF99">Nose Spray</td>
  </tr>

  <tr>
    <td class="b">Joe Schmo</td>
    <td class="" style="background-color:#99FF99">Sneezing</td>
  </tr>
  <tr>
    <td class="b">Joe Six Pack</td>
    <td class="c" style="background-color:#cccccc">Flu</td>

    <td class="right bottom" rowspan="3" style="background-color:#cccccc">Flu Shot</td>
  </tr>
  <tr>
    <td class="b">Joe The Plumber</td>
    <td class="" style="background-color:#cccccc">Flu</td>
  </tr>
  <tr>

    <td class="bottom">Joe Doe</td>
    <td class="bottom" style="background-color:#cccccc">Flu</td>
  </tr>
</table>
</body>
</html>
于 2010-10-20T16:03:34.083 に答える