/*左侧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. React 从零搭建项目 使用 create-react-app脚手架

    一.安装 npm install -g create-react-app 版本校验:create-react-app --version 二.创建项目 create-react-app指令默认调用np ...

  2. 直击 KubeCon 现场 | 阿里云 Hands-on Workshop 亮点回顾

    相关文章链接[合集]规模化落地云原生,阿里云亮相 KubeCon China沉淀九年,一文看清阿里云原生大事件 2019 年 6 月 24 日至 26 日,KubeCon + CloudNativeC ...

  3. python selenium 基础框架

    base_page.py # coding=utf-8 import time from selenium.common.exceptions import NoSuchElementExceptio ...

  4. iptables禁止代理端口

    #iptables -A INPUT -p tcp --dport 3128 -j REJECT

  5. windows下检出项目和提交项目

      1.git status:查看工作区的状态 2.git add 文件名:建立跟踪 3.git commit:提交变更 4.git push:发布本地操作 5.解决 The requested UR ...

  6. 微信小程序中 不点击picker 点击一个button 怎么调用picker 弹出选择框

    把按钮放在picker区域里就好了 picker本身就是一个区域 <picker mode = "selector" class='info' bindchange=&quo ...

  7. JS精度问题,解决方案 math.js

    JS精度问题    Vue中使用 解决方案 math.js npm install mathjs import { create, all } from 'mathjs' const config = ...

  8. Native memory allocation (mmap) failed to map xxx bytes for committing reserved memory

    遇到问题 在服务器上运行 nexus 出现Native memory allocation (mmap) failed to map 838860800 bytes for committing re ...

  9. python基础四之列表

    列表详解 列表的增删改查! 增加 li = ['zxc', 'is', 'a'] # append 在列表结尾整体添加 修改列表,但是没有返回值 li.append('boy') print(li) ...

  10. win10 uwp 使用 Azure DevOps 自动构建

    通过 Azure DevOps 可以做到自动构建程序,覆盖计划.创建.编程.测试.部署.发布.托管.共享等各个环节,适用于大多数的语言.平台. 本文继续使用图床为例告诉大家如何使用 Azure Dev ...