的CSS设置左固定和右流体布局

我需要与HTML和CSS这样布局做：左宽度为静态的250像素右是流体，屏幕的另一个静止（100％-250px）的CSS设置左固定和右流体布局

我试试这样（我使用sass）：

.wrapper{ 
    width:100%; 
    margin: 0 auto; 
    .left{ 
     width:250px; 
     float:left; 
    } 
    .right{ 
     float:right; 
     width:100%; 
     margin-left: 250px; 
    } 
    }

那么我该如何解决这个问题？

来源

2012-10-23 brabertaser19

你可以做'。左，.right {显示：表单元格}'，而不是浮动它们。 – cimmanon

这是很简单的事：http://jsfiddle.net/joplomacedo/ExHzk/ 如果你不能看到小提琴，这里的HTML和CSS。

HTML：

<div class="fixed"></div> 
<div class="fluid"></div>

CSS：

.fixed { 
    float: left; 
    width: 250px; 
} 

.fluid { 
    margin-left: 250px; 
}

除了
我离开了包装。这与示范不相关。一个问题，但：如果你给包装100％的宽度，什么是保证金：0自动为？你真的需要指定宽度吗？

来源

2012-10-23 13:59:50 banzomaikaka

是需要智慧.. – brabertaser19

宽度：自动而不是保证金 - 左边那么你可以在一个地方改变你的保证金。 – jwize

-1

试试这个代码，如果我有很好地理解：

.wrapper{ 
    width:100%; 
    margin: 0 auto; 
    .left{ 
     width:250px; 
     float:left; 
    } 
    .right{ 
     float:right; 
     width:100%; 
     margin-right: 250px; 
    } 
    }

来源

2012-10-23 13:57:44

没有帮助... – brabertaser19

-1

你可以只取出float:right上.right这样的：我没有使用SASS式

right{ 
    width:100%; 
    margin-left: 250px; 
}

http://jsfiddle.net/RfHqX/

通知。

来源

2012-10-23 14:00:48 Alex

-1

使用margin不float为right div

.wrapper{ 
    width:100%; 
    margin: 0 auto; 
} 
    .left{ 
     width:250px; 
    height:100%; 
     float:left; 
    background:#f00; 
    } 
    .right{ 

     height:100%; 
     margin-left: 250px; 
    background:#0f0; 
    }

DEMO

来源

2012-10-23 14:02:25 Champ

的CSS设置左固定和右流体布局

回答

相关问题