Html 如何让我的边界一直延伸到边缘？

好的，我有一个使用母版页和CSS样式表的网站。我很难让我的桌子边缘一直延伸到边缘。我有一种感觉，这一次将采取一些故障排除，但可怕的，如果不是。我尝试使用的网站是，我在母版页的主表上有一个边框，我想在横幅菜单下创建边框，使其一直延伸到边缘。当我为我的mainTable样式规则去掉边框间距元素时，它会使线条一直向外延伸，但是当然，所有的东西都是混合在一起的。以下是适用的代码：

<table class="mainTable">
    <tr>
        <td class="masterBannerTop" colspan="6" >
            <a href="Default.aspx"><img style="border: none; display: block; margin: 0 auto;" alt="Travel Joan's Blog Banner" src="Website%20Photos/HeadBanner.jpg" /></a>
        </td>     
    </tr>
    <tr>

    <td class="masterBannerNav"><a href="Default.aspx">HOME</a></td>
    <td class="masterBannerNav"><a href="About.aspx">ABOUT ME</a></td>
    <td>
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" Font-Size="16pt">
        <LevelMenuItemStyles>
            <asp:MenuItemStyle CssClass="masterBannerMenu" />
        </LevelMenuItemStyles>
        <LevelSubMenuStyles>
            <asp:SubMenuStyle CssClass="subMenuStyle" />
        </LevelSubMenuStyles>
            <Items>
                <asp:MenuItem Text="WHERE I'VE BEEN" NavigateUrl="~/whereivebeen.aspx">
                    <asp:MenuItem Text="UNESCO Sites" NavigateUrl="~/unesco.aspx" />
                    <asp:MenuItem Text="Places" NavigateUrl="~/BlogPosts.aspx" />
                </asp:MenuItem>
            </Items>
        </asp:Menu>
    </td>
    <td class="masterBannerMenu">
        <asp:Menu ID="Menu2" runat="server" Orientation="Horizontal">
        <LevelSubMenuStyles>
            <asp:SubMenuStyle CssClass="masterBannerMenu" />
        </LevelSubMenuStyles>
            <Items>
                <asp:MenuItem Text="PHOTOGRAPHY" NavigateUrl="~/photos.aspx">
                    <asp:MenuItem Text="Street Photos" NavigateUrl="~/StreetPhotos.aspx" />
                    <asp:MenuItem Text="People Photos" NavigateUrl="~/PeoplePhotos.aspx" />
                </asp:MenuItem>
            </Items>
        </asp:Menu>
    </td>
    <td class="masterBannerNav"><a href="Links.aspx">LINKS</a></td>
    <td class="masterBannerNav"><a href="Contact.aspx">CONTACT ME</a></td>

    </tr>
    <tr>
        <td colspan="6">
             </td>
    </tr>
    <tr>
        <td colspan="6" style="border-bottom: 1px solid #DDDDDD;">
             </td>
    </tr>

---

我试过确保主表中没有填充物。还有什么？

你知道

要包含什么吗？表格布局用于表格数据。你不能用Excel写邮件

这篇文章可能会帮助你做出正确的决定

---

设置

边框间距时：30px

，你不能让它发生。有了

，这将非常容易

---

您可以这样重建布局：，这样您就有两个

，而不是一个，这很有效：）

虽然我不想使用表，但我当然不想花时间重做整个站点。正如文章所说，表很难维护和使用，我下一次将使用CSS，但我肯定不想重新开始。好的@Joseph，我刚刚用JSFIDLE更新了我的解决方案，希望它有帮助：）好的，我需要一些时间来理解这一点。所以我会有嵌套的表。这和我下面的内容有什么关系？上面的代码是针对我的母版页的，所以我不确定添加另一个表将如何工作，但我会尝试一下并让您知道。如果您在边框后关闭“newMainTable”，然后启动新的“mainTable”，那么页面的其余部分应该保持不变（别忘了手动添加边框，因为我已经从mainTable类中删除了它）。我将尝试启动一个新表，尽管我不相信这是您的JSFIDLE中的功能。不过，我非常感谢您在这方面的帮助！我想完成这个网站！（我是新的）不太清楚您希望边界做什么。

一直延伸到边缘

-但是什么边缘？有点模糊。我确信这很容易做到，但我同意首先要做的是删除边界间距。

.mainTable
{
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    border: 1px solid #DDDDDD;
    border-spacing:30px;
}
.masterBannerTop a
{
    background-color: transparent;
    display: block;
    margin: 0 auto;
    border:none;
}
.masterBannerNav a
{
    font-family:"Century Gothic";
    font-size: 16pt;
    width: auto;
    text-align: center;  
    color: Black;
    text-decoration: none;   
    white-space: nowrap;

}
.masterBannerMenu a
{
    font-family:"Century Gothic";
    font-size: 16pt;
    width: auto;
    text-align: left;  
    color: Black;
    text-decoration: none;   

}