CSS布局 左侧定宽，右侧自适应_html/css_WEB-ITnose
有很多种方法可以实现
缩小窗口试试看？
方案一：
左边左浮动，右边加个margin-left
查看 demo
左侧定宽，右侧自适应(1) left
oooooooooooooo 0000000000000000 00000000000000000 ooooooooooooooo ooooooooooooooo 000000000000000
right
BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888 BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888
方案二：
左边左浮动，右边overflow：hidden 不过这种方法IE6下不兼容
查看 demo
左侧定宽，右侧自适应(2) left
oooooooooooooo 0000000000000000 00000000000000000 ooooooooooooooo ooooooooooooooo 000000000000000
right
BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888 BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888
方案三：
左边使用绝对定位，右边使用margin-left
查看 demo
左侧定宽，右侧自适应(3) left
oooooooooooooo 0000000000000000 00000000000000000 ooooooooooooooo ooooooooooooooo 000000000000000
right
BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888 BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888
方案四：
左边绝对定位，右边也绝对定位
查看 demo
左侧定宽，右侧自适应(4) left
oooooooooooooo 0000000000000000 00000000000000000 ooooooooooooooo ooooooooooooooo 000000000000000
right
BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888 BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888
方案五：
这种方法相对来说就有点复杂了，右边的div里边还有一个div
查看 demo
左侧定宽，右侧自适应(5) left
oooooooooooooo 0000000000000000 00000000000000000 ooooooooooooooo ooooooooooooooo 000000000000000
right
BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888 BBBBBBBBBBBBBBBBBBBBBBBBBBBBB 888888888888888888888888888888888
推荐阅读
-
左侧固定宽度，右侧自适应宽度的CSS布局
-
左侧固定宽度，右侧自适应宽度的CSS布局
-
css实现两栏布局，左侧固定宽，右侧自适应的多种方法
-
移动端自适应布局的高效方法，欢迎批评或指正_html/css_WEB-ITnose
-
css两列布局，一边固定宽度，另一边自适应_html/css_WEB-ITnose
-
水平居中--行内元素、定宽块、不定宽块_html/css_WEB-ITnose
-
css判断不同分辨率显示不同宽度布局实现自适应宽度_html/css_WEB-ITnose
-
css多栏自适应布局_html/css_WEB-ITnose
-
CSS：三栏布局，两边固定，中间自适应_html/css_WEB-ITnose
-
三列中间自适应布局(来自网易)_html/css_WEB-ITnose