CSS：自动调整大小div以适应容器宽度 [英] CSS: Auto resize div to fit container width

问题描述

我有两个< div> ：左和内容。这两个在 wrapper div中，具有 min-width：960px; 。 左具有固定宽度，但我想使内容灵活，最小宽度为 700像素，如果屏幕较宽，请将其粘贴到屏幕右边界。

I have two <div>: left and contents. These two are inside wrapper div that has min-width:960px;. left has fixed width, but I want to make content flexible with min width of 700px and if screen is wider, stick it to the right bound of screen.

CSS ：

#wrapper
{
    min-width:960px;
    margin-left:auto;
    margin-right:auto;
}
#left
{
    width:200px;
    float:left;
    background-color:antiquewhite;
    margin-left:10px;
}
#content
{
    min-width:700px;
    margin-left:10px;
    width:auto;
    float:left;
    background-color:AppWorkspace;
}

JSFiddle： http://jsfiddle.net/Zvt2j/

JSFiddle: http://jsfiddle.net/Zvt2j/

推荐答案

overflow：hidden 到您的 #content 。这样写：

#content
{
    min-width:700px;
    margin-left:10px;
    overflow:hidden;
    background-color:AppWorkspace;
}

检查此http://jsfiddle.net/Zvt2j/1/

这篇关于CSS：自动调整大小div以适应容器宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！