沫沫金:2014最新全浏览器兼容左列固定右列自适应宽度技巧大公开

简介: 做前端的人肯定会遇到经典的左列固定,右列自适应宽度的样式效果。这种想起来很简单做起来很麻烦的事情今天你有好方案了。--不要信那些什么左侧写固定宽度,右侧不用写宽度属性和浮动属性,浏览器自动就实现右列自适应的话。

做前端的人肯定会遇到经典的左列固定,右列自适应宽度的样式效果。这种想起来很简单做起来很麻烦的事情今天你有好方案了。


--不要信那些什么左侧写固定宽度,右侧不用写宽度属性和浮动属性,浏览器自动就实现右列自适应的话。亲自试过了,没用 谁愿意可以也试试——谁试谁知道^&^


--更不要为了在css中实现右列自动获取宽度值而使用“expression()”,不想吐槽后期谁维护谁知道——造孽呀!


正文来了:最新的组合实现左列固定宽度右列宽度自适应方案如下


.left{
    width:546px;
    height:91px;
}
.right{
    width:100%;
    height:91px;
}

重点看下面的div结构

<div class="right">
    <div class="left"></div>
</div>

仔细对比你就会发现,只需要让left层放到right层里面就OK了,搞定j_0015.gif(欢迎大家添加 976 465 669 本人的QQ交流最新最流行的技术和项目工作互换)本人在古都西安

目录
相关文章
|
Kubernetes 容器
Kubernetes部署Dashboard(WEB UI管理界面)
Kubernetes部署Dashboard(WEB UI管理界面)
Kubernetes部署Dashboard(WEB UI管理界面)
|
存储 NoSQL 数据挖掘
MongoDB 实时分析案例
【5月更文挑战第7天】
420 0
|
Java 数据库连接 mybatis
mybatis plus字段为null或空字符串把原来的数据也更新了,只需要注解
mybatis plus字段为null或空字符串把原来的数据也更新了,只需要注解
428 0
|
运维 监控 安全
【ELK入门】Elastic中文社区运维监控实战之架构篇
阿里云MVP曾勇撰写的《ELK运维监控入门实战》系列,以Elasticsearch中文社区网站运维监控体系搭建作为案例,讲解了ELK监控系统的相关原理和技术实现,可作为对ELK感兴趣的同学的入门级文章。本篇作为第一篇,介绍了项目背景和技术架构。
6749 0
|
存储 Python
uwsgi部署python web项目
uwsgi部署python web项目
493 0
uwsgi部署python web项目
|
前端开发 JavaScript 搜索推荐
浏览器之性能指标-FID(一)
浏览器之性能指标-FID(一)
414 0
|
数据采集 索引
NI采集卡USB-6361多通道模拟输入采集报错解决方案
折腾一块 USB-6361 采集卡很久了,之前都是单通道采集模拟信号,突然接到要使用双通道采集模拟信号,本想着就新增加一路 Analog Input task 即可,但事情总没有想象的那么简单,因此记录一下解决的方法。
421 0
|
存储 人工智能 弹性计算
阿里云高性能计算负责人何万青:阿里云大计算加速HPC与AI融合
与AI相结合,高性能计算能够帮助科研人员将精力集中于专业领域。
阿里云高性能计算负责人何万青:阿里云大计算加速HPC与AI融合
|
存储 算法 C语言
Dijkstra(迪杰斯特拉算法)的实现(C,C++,Matlab)
Dijkstra 算法(中文名:迪杰斯特拉算法)是由荷兰计算机科学家 Edsger Wybe Dijkstra 提出。该算法常用于路由算法或者作为其他图算法的一个子模块。举例来说,如果图中的顶点表示城市,而边上的权重表示城市间开车行经的距离,该算法可以用来找到两个城市之间的最短路径。二.算法描述 💡算法思想 设G=(V,E)是一个带权有向图,把图中顶点集合V分为两组,第一组为已求出最短路径的顶点集合(用S表示,初始时S中只有一个源点,以后每求得一条最短路径 , 就将加入到集合S中,直到全部顶点都加入到S中,算法就结束了), 第二组为其余未确定最短路径的顶点集合(用U表示),按最短路径的的递增
930 1
Dijkstra(迪杰斯特拉算法)的实现(C,C++,Matlab)
|
数据采集 机器学习/深度学习 运维
《数据中台架构:企业数据化最佳实践》:感受数据中台建设五步法
《数据中台架构:企业数据化最佳实践》:感受数据中台建设五步法
1521 0
《数据中台架构:企业数据化最佳实践》:感受数据中台建设五步法