html - 左侧元素具有恒定宽度，右侧部分根据页面缩放

Question

我从没想过这很难做到，我想我错过了全部要点而忘记了一部分，但问题很简单。

目前我正在创建一个单页应用程序，它有 2 个大元素，左边是菜单，右边是其他所有元素(就像仪表板一样!)。

我的页面必须是这样的:

.menu { width:300px } .content { width:100% - 300px}

这可能如此简单，还是我需要绝对定位内容并给它一个 300 像素的 margin-left，在我看来，使用这样的技巧感觉不对。是否有更好的选择，或者这是要走的路？

Answer 1

你很接近。您只需要使用 CSS calc 方法:

.menu { width:300px } .content { width: calc(100% - 300px) }