Html 图像和表格之间的未解释空间

早上好

在我的网页（www.tradecaptaincaching.com）上，我的头像和生成的表格之间有一个莫名其妙的差距。该表由生成。在花了一整天的时间之后，我得到了图像和桌子，除了200像素的巨大间隙，这让我抓狂

我用Chrome浏览器查看了页面，没有看到任何奇怪的东西。当然，我是如此的生疏，以至于我仍然在使用表格，并且必须查找“CSS！”的拼写。）

代码如下。它位于香草Drupal Fusion入门基本页面上。请原谅我糟糕的编码方法。我还在学习

任何帮助和学习都将不胜感激

谢谢大家

    <img style="padding-top: 20px" alt="Trade Captain Coaching Image" src="/images/LandingImageText.png" style="height:400px; width:960px" usemap="#menumap" />
<map name="menumap">
  <area shape="rect" coords="590,20,650,45" href="http://tradecaptaincoaching.com" alt="Home Page">
  <area shape="rect" coords="675,20,735,45" href="http://tradecaptaincoaching.com/about" alt="About Page">
  <area shape="rect" coords="760,20,830,45" href="http://tradecaptaincoaching.com/contact" alt="Contact Page">
  <area shape="rect" coords="855,20,935,45" href="http://tradecaptaincoaching.com/services" alt="Services Page">
</map>
<style type="text/css">
.tg  {border-collapse:separate;border-spacing:0;margin:0px auto;}
.tg td{font-family:Arial, sans-serif;font-size:14px;border-style:none;overflow:hidden;word-break:normal;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:5px 20px;border-style:none;overflow:hidden;word-break:normal;}
.tg .tg-cfld{font-size:13px;font-family:Verdana, Geneva, sans-serif !important;;color:#000064; padding:5px 20px;}
.tg .tg-e9q7{font-weight:bold;font-size:14px;font-family:Verdana, Geneva, sans-serif !important;;background-color:rgb(116,196,218);color:#000064;line-height: 30px; padding: 0px 0px 0px 20px;}
.tg .tg-031e{vertical-align:top;line-height: 20px; padding:5px 0px 23px 0px}
</style>
<table class="tg" style="undefined;table-layout: fixed; width: 960px">
<colgroup>
<col style="width: 320px">
<col style="width: 320px">
<col style="width: 320px">
</colgroup>
  <tr>
    <th class="tg-e9q7">Choose Your Course</th>
    <th class="tg-e9q7">Your Promotion</th>
    <th class="tg-e9q7">Your Program</th>
  </tr>
  <tr>
    <td class="tg-cfld">Text Here. </td>
    <td class="tg-cfld">Text Here. </td>
    <td class="tg-cfld">Text Here. </td>
  </tr>
 <tr>
    <td class="tg-031e" rowspan="4"><img src="/images/NoGold.png" style="height:300px; width:320px" /></td>
    <td class="tg-031e"></td>
    <td class="tg-031e"><img style="margin:0px auto;display:block" src="/images/ContactUs.png" style="height:30px; width:147px" /></td>
  </tr>
  <tr>
    <td class="tg-e9q7" colspan="2">Your First Trade Here is FREE</td>
  </tr>
  <tr>
    <td class="tg-cfld" colspan="2">Text Here. <br><br><br><br><br><br><br></td>
  </tr>
  <tr>
    <td class="tg-031e"></td>
    <td class="tg-031e"></td>
  </tr>
</table>

.tg{边框折叠：分隔；边框间距：0；边距：0px自动；}
.tg td{字体系列：Arial，无衬线；字体大小：14px；边框样式：无；溢出：隐藏；分词：正常；}
.tg th{字体系列：Arial，无衬线；字体大小：14px；字体重量：正常；填充：5px 20px；边框样式：无；溢出：隐藏；分词：正常；}
.tg.tg cfld{字体大小：13px；字体系列：Verdana，日内瓦，无衬线！重要；；颜色：#000064；填充：5px20px；}
.tg.tg-e9q7{字体大小：粗体；字体大小：14px；字体系列：Verdana，Geneva，sans serif！重要；；背景色：rgb（116196218）；颜色：000064；线条高度：30px；填充：0px 0px 0px 20px；}
.tg.tg-031e{垂直对齐：顶部；线高度：20px；填充：5px 0px 23px 0px}
选择你的课程
你的晋升
你的程序
文本在这里。
文本在这里。
文本在这里。
你在这里的第一笔交易是免费的
文本在这里

首先，为什么您的

样式

块在html

正文中

？没有理由把它放在那里。相反，把它放在你的

头上

其次，在您指向的页面中，在
块之后有几个

元素。仅此一项就将在标题图像和表格之间添加不需要的空间：

<br>
<br>
<br>








最后，您正在图像
地图
定义中添加更多的

元素。那里根本不应该有任何休息。由于中断在该上下文中没有意义，它们只是添加到图像后面的页面可见流中。
感谢大家的帮助和见解。我最终通过删除代码中的所有换行符解决了这个问题。这使得代码实际上不可读。但无论如何，CSS对我来说几乎是不可读的。所以，什么来了，什么来了；）在我的头像和桌子之间还有一个小小的缺口，这仍然是一个谜。但是我对任何一个CSS问题都有八个小时的限制，这已经远远超过了限制

再次感谢你们所有的圣徒！
CA
LandingImageText.png的尺寸是多少？图像下方是否有200px的空白？在图像编辑器中打开它并检查尺寸。它是960 x 400。这是正确的。当我检查铬元素时，它看起来很好。但是…我不是那么聪明所以：谢谢你！我的代码中唯一有
的地方是最后一个单元格的最后一行。在图像之后。我之所以使用它们，是因为如果我不使用黄金图像后的所有单元格大小都不起作用，我想不出任何其他解决方案。查看代码，我的地图部分没有
。你怎么看他们而我没有？对不起，我不知道你的第一段是什么意思。如果我知道如何在没有它们的情况下获得同样的结果，我将失去这个机会：p