/*左侧div*/

.left-div{width: 220px;height: 100%;position: fixed;background: #FFFFFF;}

/*右侧div*/

.right-div{top: 0px; bottom:0px;left:220px;right:0px;position: fixed;background: #000000;}

解决思路就是将左侧的div的高度和宽度设置好，然后右侧div只需要设置top，bottom，left，right这四个属性就可以解决这个问题了。

解决css布局时两个div一个宽度固定另一个占满剩余宽度的问题的更多相关文章

  1. css实现两个div并排等高（一个div高度随另一个高度变化而变化）

    方法一.两个div都设置 display: table-cell; 方法二.父级div设置 display: -webkit-box;

  2. 如何让两个div在同一行显示?一个float搞定

    最近在学习div和css,遇到了一些问题也解决了很多以前以为很难搞定的问题.比如:如何让两个div显示在同一行呢?(不是用table表格,table对SE不太友好)其实,<div> 是一个 ...

  3. Flex 布局 （两个div居中自适应 宽度变小变一列，宽度够就是两列）

    https://www.runoob.com/w3cnote/flex-grammar.html display: flex; justify-content: center; align-items ...

  4. css布局之两列布局

    我们见过两列布局的网站也很多,不过这种两列布局的分为两种:自适应和固定宽度 1.自适应两列布局 <!DOCTYPE html> <html lang="en"&g ...

  5. css实现左右两个div等高

    提出问题: 现在有两个div,但是两个div里面内容多少不确定,可能左边多,可能右边多,css要如何设置可以保证左右两边的div等高呢? 解决方案: 每个div使用display:table-cell ...

  6. DIV+CSS布局时， DIV的高度和宽度特性

    这个没有特别的做要求,你要根据你自己的页面整体布局来设置,还有根据div的特性来设置,div默认情况是宽度最大化(100%).高度最小化,高度随着内容自动伸展: 一般情况做网页的话,大部分都是固定了总 ...

  7. CSS布局——横向两列布局

    1.固定两栏布局,使用float,注意对紧邻元素清除浮动影响.IE6在使用float布局同时设置横行margin的情况下会有双边距BUG,解决方案是加入_display:inline 代码如下: &l ...

  8. 解决网页刷新时，隐藏div元素闪现问题

    最近项目遇到一个问题,需要对一个div中的元素设置根据不同的情况进行显示和隐藏. 因为默认该div是显示的,所以在刷新页面的时候,会先加载这个div进行显示,加载完成后又执行到 hide() 方法,使 ...

  9. 解决：并排的两个div底部对齐

    我希望在页面上画2个栈,并列起来,并且其内容是动态的,高度.宽度都可变,但是要保持底部对齐,如图: 实现的代码如下: <html> <head> <meta http-e ...

随机推荐

  1. jQuery 图片高亮显示

    主要的jQuery代码: $(function() { $("ul li").hover(function() { // over //鼠标移入当前列透明度为1 其他列为0.5 $ ...

  2. Codeforces 662D International Olympiad【贪心】

    比赛的时候后缀长度在4位以内的时候分类讨论了一下,其实他们完全是一个套路的..并不需要讨论. 然后没有考虑前导0的情况,就wa了.. 题目链接: http://codeforces.com/probl ...

  3. C++结构体中的静态变量

    分享一个挺有意思的代码: #include <bits/stdc++.h> using namespace std; struct Point { static int cnt; Poin ...

  4. HDU-1114_Piggy-Bank

    Piggy-Bank Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Problem ...

  5. Java练习 SDUT-1140_面向对象程序设计上机练习一（函数重载）

    面向对象程序设计上机练习一(函数重载) Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 利用数组和函数重载求5个数最大值 ...

  6. 自定义View系列教程04--Draw源码分析及其实践

    深入探讨Android异步精髓Handler 站在源码的肩膀上全解Scroller工作机制 Android多分辨率适配框架(1)- 核心基础 Android多分辨率适配框架(2)- 原理剖析 Andr ...

  7. 在springmvc中 @RequestMapping(value={"", "/"})是什么意思

    这个意思是说请求路径 可以为空或者/ 我给你举个例子:比如百度知道的个人中心 访问路径是 http://zhidao.baidu.com/ihome,当然你也可以通过 http://zhidao.ba ...

  8. 洛谷P2947 [USACO09MAR]向右看齐Look Up

    #include<cstdio> #include<algorithm> #include<stack> #include<cctype> using ...

  9. Oracle中的Union、Union All、Intersect、Minus[转]

    众所周知的几个结果集集合操作命令,今天详细地测试了一下,发现一些问题,记录备考. 假设我们有一个表Student,包括以下字段与数据: drop table student; create table ...

  10. Spring AOP 的实现 原理

    反射实现 AOP 动态代理模式实例说明(Spring AOP 的实现 原理)   比如说,我们现在要开发的一个应用里面有很多的业务方法,但是,我们现在要对这个方法的执行做全面监控,或部分监控.也许我们 ...