浏览器在 <table> 标签之前呈现的幻像 <br> 标签答案

【问题标题】：Phantom <br> tag rendered by browsers prior to <table> tag浏览器在 <table> 标签之前呈现的幻像 <br> 标签
【发布时间】：2012-01-13 21:45:01
【问题描述】：

浏览器似乎在我的

之前呈现了一个
标签。整个页面应该在同一个表中呈现，但是代码中没有的
标记创建了一个恼人的空白。

代码如下所示，包括使用查看源代码时：

<body>
   <div class='container'>
      <table cellpadding="0" cellspacing="0" width="978px" style="border:2px solid blue;">

但页面在浏览器中有一个胖空间，当我在 Chrome 中使用“检查元素”时出现如下：

<body>
   <div class='container'>
      <br>
      <table cellpadding="0" cellspacing="0" width="978px" style="border:2px solid blue;">

我仔细研究了我的 CSS 和我的代码，但我无法弄清楚。

如果我需要在某处更具体，请告诉我。

【问题讨论】：

那么，当您检查时，您会看到<br> 标签吗？或者只是觉得你看不到 <br> 元素？
我们可以在某个地方看到现场演示吗？或许您可以发帖representative demo on JS Fiddle 向我们展示问题所在？
当我检查时，有一个可见的、清晰的
标签，所有四个字符。我什至可以张贴照片证据。
页面上是否运行了某种 JavaScript？代码显示在检查中而不显示在源代码中的唯一方法是在页面加载后将其添加到 DOM。
我已经看到当 html 出现一些语法错误时会发生这种情况。正如其他人所说，如果我们可以看到实际页面，那将会有所帮助。或者至少发布更多的代码，我们只能看到开始标签，而不是在哪里结束。

标签： html browser

【解决方案1】：

由于页面上没有任何脚本，我唯一能想到的就是它被注入了，因为你的代码isn't valid。尝试修复那里的错误，看看它是否能解决您的问题。

【讨论】：

使代码有效修复了它，所以感谢您的建议。我会回去看看到底是我做了什么导致了这个特殊的问题，因为我一次解决了所有问题，就像一个混蛋......

【解决方案2】：

如果确实有一个<br> 标记通过 Chrome 的检查元素显示，那么我会检查你的 Javascript，因为我知道你不能通过 CSS 插入 DOM 元素。如果您确定这不是问题，我会尝试禁用所有浏览器插件，以消除其中一个插件这样做的可能性。

编辑：这是无效的语法，特别是

            <div>
            <table cellpadding="0" cellspacing="0" width="978px" style="border:2px solid blue;">
                <tr style='font-size:1px'><td width="200px">&nbsp;</td><td width="500px">&nbsp;</td><td width="200px">&nbsp;</td></tr>                        
                        <tr><td rowspan='2' class="logobox"><img src="http://www.frontrowking.com/images/FRK-LOGO.gif" alt="Front Row King Tickets" width="198" height="102" align="left" class="logo" /></td>
                            <td width='771px' height='70px' style='vertical-align:center; text-align:center;'>
                                Test Page Tickets
                                Keyword Text!
                                <div style='vertical-align:bottom;'>breadcrumbs &gt;&gt; breadcrumb</div>
                            </td></tr>
                        <tr><td colspan="2" align="center" style='vertical-align:bottom;'>
                            <table cellpadding="0" cellspacing="0" border-spacing='0' width="100%" style="border:none; max-height:34px; margin-top:8px;">
                                <tr class='navbar'>
                                    <td class="hov" width="18%"><div align="center"><a class="header-link">menu3</a></div></td> 
                                    <td class="hov" width="18%"><div align="center"><a class="header-link">menu</a></div></td> 
                                    <td class="hov" width="18%"><div align="center"><a class="header-link">menu</a></div></td>
                                    <td class="hov" width="30%"><div align="center"><input type='text' /><a class="header-link">search</a></div></td>
                                </tr>
                            </table>
                        </td>
                        </tr>
            </div>

您在关闭table 之前关闭了外部div。在</table> 之后移动</div> 应该可以解决问题。

【讨论】：