解决css布局时两个div一个宽度固定另一个占满剩余宽度的问题
/*左侧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一个宽度固定另一个占满剩余宽度的问题的更多相关文章
- css实现两个div并排等高(一个div高度随另一个高度变化而变化)
方法一.两个div都设置 display: table-cell; 方法二.父级div设置 display: -webkit-box;
- 如何让两个div在同一行显示?一个float搞定
最近在学习div和css,遇到了一些问题也解决了很多以前以为很难搞定的问题.比如:如何让两个div显示在同一行呢?(不是用table表格,table对SE不太友好)其实,<div> 是一个 ...
- Flex 布局 (两个div居中自适应 宽度变小变一列,宽度够就是两列)
https://www.runoob.com/w3cnote/flex-grammar.html display: flex; justify-content: center; align-items ...
- css布局之两列布局
我们见过两列布局的网站也很多,不过这种两列布局的分为两种:自适应和固定宽度 1.自适应两列布局 <!DOCTYPE html> <html lang="en"&g ...
- css实现左右两个div等高
提出问题: 现在有两个div,但是两个div里面内容多少不确定,可能左边多,可能右边多,css要如何设置可以保证左右两边的div等高呢? 解决方案: 每个div使用display:table-cell ...
- DIV+CSS布局时, DIV的高度和宽度特性
这个没有特别的做要求,你要根据你自己的页面整体布局来设置,还有根据div的特性来设置,div默认情况是宽度最大化(100%).高度最小化,高度随着内容自动伸展: 一般情况做网页的话,大部分都是固定了总 ...
- CSS布局——横向两列布局
1.固定两栏布局,使用float,注意对紧邻元素清除浮动影响.IE6在使用float布局同时设置横行margin的情况下会有双边距BUG,解决方案是加入_display:inline 代码如下: &l ...
- 解决网页刷新时,隐藏div元素闪现问题
最近项目遇到一个问题,需要对一个div中的元素设置根据不同的情况进行显示和隐藏. 因为默认该div是显示的,所以在刷新页面的时候,会先加载这个div进行显示,加载完成后又执行到 hide() 方法,使 ...
- 解决:并排的两个div底部对齐
我希望在页面上画2个栈,并列起来,并且其内容是动态的,高度.宽度都可变,但是要保持底部对齐,如图: 实现的代码如下: <html> <head> <meta http-e ...
随机推荐
- 跳出手掌心--如何立即触发UIButton边界事件
http://www.cocoachina.com/ios/20150611/12082.html 最近在使用UIButton的过程中遇到一个问题,我想要获得手指拖动button并离开button边界 ...
- Flask学习之八 关注、联系人和好友
英文博客地址:http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-viii-followers-contacts-and- ...
- jQuery 练习 dom
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- tensorflow学习笔记(三十四):Saver(保存与加载模型)
Savertensorflow 中的 Saver 对象是用于 参数保存和恢复的.如何使用呢? 这里介绍了一些基本的用法. 官网中给出了这么一个例子: v1 = tf.Variable(..., nam ...
- 06Redis入门指南笔记(安全、通信协议、管理工具)
一:安全 1:可信的环境 Redis以简洁为美.在安全层面Redis也没有做太多的工作.Redis的安全设计是在"Redis运行在可信环境"这个前提下做出的.在生产环境运行时不能允 ...
- Go 语言开发工具
Go 语言开发工具 LiteIDE LiteIDE是一款开源.跨平台的轻量级Go语言集成开发环境(IDE). 支持的操作系统 Windows x86 (32-bit or 64-bit) Linux ...
- @COCI 2016/2017 Round 3@ Meksikanac
目录 @description@ @solution@ @accepted code@ @details@ @description@ 在平面直角坐标系中,给定一个左下角为 (0, 0),右上角为 ( ...
- pytorch中查看gpu信息
其他:windows使用nvidia-smi查看gpu信息 为什么将数据转移至GPU的方法叫做.cuda而不是.gpu,就像将数据转移至CPU调用的方法是.cpu?这是因为GPU的编程接口采用CUDA ...
- js切割字符串
var time_str= '2019-9-10 13:18:20'; var t = time_str.substr(2,8); console.log(t); 输出 19-9-10
- HTML静态网页--JavaScript-Window.document对象
1.Window.document对象 一.找到元素: docunment.getElementById("id"):根据id找,最多找一个: var a =docunmen ...