css实现左侧固定宽度,右侧宽度自适应
#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实现左侧固定宽度,右侧宽度自适应的更多相关文章
- HTML和CSS实现左侧固定宽度右侧内容可滚动
在做移动端页面的时候,经常会碰到一个div中分左右两个div,左侧div固定宽度或百分比,右侧div中内容左右溢出,需要左右滑动才可以浏览到全部内容,为此写了一个demo. 处理这个问题的核心关键点是 ...
- CSS两列布局——左侧宽度固定,右侧宽度自适应的3种方法
1.左侧绝对定位法 直接看代码: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- css实现div两列布局——左侧宽度固定,右侧宽度自适应(两种方法)
原文:css实现div两列布局--左侧宽度固定,右侧宽度自适应(两种方法) 1.应用场景 左侧一个导航栏宽度固定,右侧内容根据用户浏览器窗口宽度进行自适应 2.思路 首先把这个问题分步解决,需要攻克以 ...
- CSS无序列实现表宽度自适应的表格
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- css左侧固定宽度右侧自适应
左侧固定宽,右侧自适应屏幕宽: 左右两列,等高布局: 左右两列要求有最小高度,例如:200px;(当内容超出200时,会自动以等高的方式增高) 要求不用JS或CSS行为实现: 仔细分析试题要求,要达到 ...
- css中左侧固定,右侧自适应
谈谈我开始出来工作时候的一道面试题吧 当初我记得在太平洋网络面试的时候,面试官给我出了这么一道题: 有一个外层的div 中间有左右两个div 要求左侧的div 1.只告诉你宽度; 2.只告 ...
- CSS实现侧边栏固定宽度,内容栏自适应
1,固定宽度区浮动,自适应区不设宽度而设置 margin 我们拿右边定宽左边自适应来做示范,CSS代码如下: #wrap { overflow: hidden; *zoom: 1; } #c ...
- 在页面布局中,CSS如何实现左侧宽度固定,右侧宽度自适应的布局?
首先给出DOM结构 <divclass="box"> <divclass="box-left"></div> <div ...
- HTMLCSS实现左侧固定宽度右侧内容可滚动
在做移动端页面的时候,经常会碰到一个div中分左右两个div,左侧div固定宽度或百分比,右侧div中内容左右溢出,需要左右滑动才可以浏览到全部内容,为此写了一个demo. 处理这个问题的核心关键点是 ...
随机推荐
- 【转】__cplusplus的含义
有点代码中会看到以下形式的代码: #ifdef __cplusplus extern "C" {#endif #ifdef __cplusplus}#endif 这些代码是什么意思 ...
- kettle Spoon.bat闪退解决办法
1.Java环境配置问题 java_home:D:\Program Files\Java\jdk1.7.0_25(安装jdk路径) classpath:.;%java_home%\lib\dt.jar ...
- 安装docker fastdfs
# step 1: 安装必要的一些系统工具 sudo yum install -y yum-utils device-mapper-persistent-data lvm2# Step 2: 添加软件 ...
- 下载好的vue项目如何在自己电脑环境上运行,步骤!!
本文链接:https://blog.csdn.net/qq_39309900/article/details/84837659首先第一步,需要安装node.js 下载地址:https://nodejs ...
- java线程基础巩固---同步代码块以及同步方法之间的区别和关系
在上一次中[http://www.cnblogs.com/webor2006/p/8040369.html]采用同步代码块的方式来实现对线程的同步,如下: 对于同步方法我想都知道,就是将同步关键字声明 ...
- windows下基于IIS配置ssl证书遇到的坑
前几天配置windows下基于IIS配置ssl证书 完全按照步骤执行 绑定https网址后,一直显示:无法访问此网站 检查了443端口,还有防火墙限制,没发现什么 足足困扰了我好几天 后来突然想到前不 ...
- JAVA WEB之Servlet使用
3. JSP提交数据和Servlet程序设计 想要将JSP数据提交,主要的方法有form表单方式.url方式和Session方式.将JSP数据传递给后台,form表单显然比较简单方便. 正如上一节中展 ...
- pip安装第三方库时提示No Module named pip
因为多次卸载/安装python不同版本导致出现pip模块不存在的问题,原因可能是环境没有配置好执行下面命令 ----完成
- 小程序wx.showToast()方法实现文字换行
小程序wx.showToast()方法实现文字换行 在文字中间加上 '\r\n' 真机中生效 wx.showToast({ title: `换行前内容\r\n换行后内容`, icon: 'none' ...
- 201871010105-曹玉中《面向对象程序设计(java)》第十七周学习总结
201871010105-曹玉中<面向对象程序设计(java)>第十七周学习总结 项目 内容 这个作业属于哪个过程 https://www.cnblogs.com/nwnu-daizh/ ...