#centerDIV {
height: 550px;
width: 100%;
}
#mainDIV {
height: 100%;
border: 1px solid #F00;
margin-left: 102px;
}
#leftDIV {
float: left;
width: 100px;
height: 100%;
border: 1px solid #F00;
} <div id="centerDIV">
<div id="leftDIV"></div>
<div id="mainDIV"></div>
</div>

左侧leftDIV的float:left;width固定,右侧的mainDIV用margin-left

css实现左侧固定宽度,右侧宽度自适应的更多相关文章

  1. HTML和CSS实现左侧固定宽度右侧内容可滚动

    在做移动端页面的时候,经常会碰到一个div中分左右两个div,左侧div固定宽度或百分比,右侧div中内容左右溢出,需要左右滑动才可以浏览到全部内容,为此写了一个demo. 处理这个问题的核心关键点是 ...

  2. CSS两列布局——左侧宽度固定,右侧宽度自适应的3种方法

    1.左侧绝对定位法 直接看代码: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  3. css实现div两列布局——左侧宽度固定,右侧宽度自适应(两种方法)

    原文:css实现div两列布局--左侧宽度固定,右侧宽度自适应(两种方法) 1.应用场景 左侧一个导航栏宽度固定,右侧内容根据用户浏览器窗口宽度进行自适应 2.思路 首先把这个问题分步解决,需要攻克以 ...

  4. CSS无序列实现表宽度自适应的表格

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. css左侧固定宽度右侧自适应

    左侧固定宽,右侧自适应屏幕宽: 左右两列,等高布局: 左右两列要求有最小高度,例如:200px;(当内容超出200时,会自动以等高的方式增高) 要求不用JS或CSS行为实现: 仔细分析试题要求,要达到 ...

  6. css中左侧固定,右侧自适应

    谈谈我开始出来工作时候的一道面试题吧 当初我记得在太平洋网络面试的时候,面试官给我出了这么一道题: 有一个外层的div 中间有左右两个div 要求左侧的div 1.只告诉你宽度;       2.只告 ...

  7. CSS实现侧边栏固定宽度,内容栏自适应

    1,固定宽度区浮动,自适应区不设宽度而设置 margin 我们拿右边定宽左边自适应来做示范,CSS代码如下: #wrap {    overflow: hidden; *zoom: 1;  }  #c ...

  8. 在页面布局中,CSS如何实现左侧宽度固定,右侧宽度自适应的布局?

    首先给出DOM结构 <divclass="box"> <divclass="box-left"></div> <div ...

  9. HTMLCSS实现左侧固定宽度右侧内容可滚动

    在做移动端页面的时候,经常会碰到一个div中分左右两个div,左侧div固定宽度或百分比,右侧div中内容左右溢出,需要左右滑动才可以浏览到全部内容,为此写了一个demo. 处理这个问题的核心关键点是 ...

随机推荐

  1. 接口测试工具中 post请求如何传递多维数组

    1,请求参数为数组时,可以采用传递 json格式的形式传递请求参数(字段及字段对应的值如查是字符,都应该用双引号括起来.用单引号会无法识别),后台接收的数据为json . 2,直接以数组格式来请请求 ...

  2. JavaScript对象原型

    一.MDN上的解释(有点抽象) 基于原型的语言? JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模 ...

  3. 2019.9.30 ErrorWidget 的使用

    开发过程中总会碰见页面出现错误的情况,这时候整个页面一片红, 如下 测试阶段出现这样的问题就算了,万一正式环境也出现这个就要不和谐了.所以就有了ErrorWidget.这个是要在最底层设置一下就可以屏 ...

  4. qspi nor

    qspi: sf probe SF: Detected s25fl256s_256k with page size 512 Bytes, erase size 256 KiB, total 32 Mi ...

  5. JAVA 流与文件

    流 InputStream和OutputStream是所有的输入流和输出流的超类.他们两个都是抽象类. read方法和write方法都是阻塞方法,这意味着如果不能里可以写入或者读取,比如因为网络问题, ...

  6. 重温JSP学习笔记

    <% double d1 = 3.5; double d2 = 4.4; pageContext.setAttribute("d1", d1); pageContext.se ...

  7. Java-生成缩略图工具类

    import java.awt.Color; import java.awt.Graphics2D; import java.awt.Image; import java.awt.RenderingH ...

  8. Spark配置详解

    Spark提供三个位置用来配置系统: Spark属性:控制大部分的应用程序参数,可以用SparkConf对象或者Java系统属性设置 环境变量:可以通过每个节点的 conf/spark-env.sh脚 ...

  9. 分析 JUnit 框架源代码

    本文转载至http://www.ibm.com/developerworks/cn/java/j-lo-junit-src/ 分析 JUnit 框架源代码 理解 JUnit 测试框架实现原理和设计模式 ...

  10. 灰度图像--图像分割 阈值处理之P-Tile阈值

    学习DIP第53天 转载请标明本文出处:***http://blog.csdn.net/tonyshengtan ***,出于尊重文章作者的劳动,转载请标明出处!文章代码已托管,欢迎共同开发:http ...