Html 谷歌地图在表格单元格中的宽度

我正在尝试创建一个简单的web界面，其中包含一个包含两列的表：

• 左：宽度400px
• 右：可用宽度的其余部分

我认为这很简单，但我做不到。这段代码离成功越近

HTML:

但始终显示水平滚动条，且地图溢出窗口宽度

---

谢谢，很抱歉我的英语不好

滚动条可能是主体的默认边距，也是表格的边框。你可以试试这个

HTML

查看此演示

编辑

作为你评论的旁白：发生这种情况是因为你有

position:absolute

，所以他正在搜索他最近的父母，并且声明了一个非绝对位置。要解决此问题，请在css上添加此选项：

 table td {
    position:relative;
}

---

新的演示

谢谢Danko，你解决了我遇到的其他问题，但我的地图仍然溢出。问题是，如何填充贴图所在单元格的100%？现在我可以创建一个类似于您示例中的表，但是如果左列的宽度为300px，则溢出为300px。。。我的意思是，我想要一张100%宽的桌子，300px在左列，其余的在右列。。。我很迷茫…我不明白如果你想要300px，只需更改值。。。现在，如果问题是内部的映射，我需要查看包括映射在内的所有代码，你能做一把小提琴吗？我认为问题在于div map_画布的CSS，因为我能够创建一个表，左栏有300px，右栏有剩余的可用宽度，但是当我用这个CSS将div map_画布放在右边的列上时：它会向右增长，因为div的宽度是总宽度的99%，我想要总列宽的99%，也就是说，总可用宽度减去侧边栏的300px。再次感谢！它适用于宽度！！但是我想把高度设置为100%，当我把它放在css上时，我在页面加载时看不到任何东西。谢谢你的帮助Danko！！高度为浏览器大小的100%？

#map_canvas {
    position: absolute;
    min-height: 99%;
    height: auto !important;
    height: 99%;
    _height: 99%;
    width: 80%;
}

<table id="container">
    <tr>
        <td style="width:400px">
            <div id="sidebar" style="z-index:1;"></div>
        </td>
        <td>
            <div id="map_canvas" style="z-index:10;"></div>
        </td>
    </tr>
</table>

* {
  padding:0;
  margin:0;
}
table {
  width:100%;
  border-collapse:collpse;
  border:0 none;
}

 table td {
    position:relative;
}