HTML左边盒子固定,右边盒子自适应

html:
<div class="box1">
<div class="divA">DIVA</div>
<div class="divB">DIVB</div>
</div>
css:
<style type="text/css">
* {
margin: 0;
padding: 0;
} .box1 {
width: 100%;
height: 300px;
background: #008000;
padding:1px;
box-sizing: border-box;
}
.divA {
width: 150px;
height: 150px;
background: red;
text-align: center;
float: left;
} .divB {
margin-left: 150px;
height: 260px;
background: blue;
text-align: center;
margin-top: 20px;
}
</style>
HTML左边盒子固定,右边盒子自适应的更多相关文章
- css-两个div并排,左边宽度固定右边自适应的布局 的实现方法
<div class= "container"> <div class="left"></div> <div clas ...
- 实现一个div,左边固定div宽度200px,右边div自适应
实现一个div,左边固定div宽度200px,右边div自适应<div class= "container"> <div class="left&quo ...
- HTML布局之左右结构,左边固定右边跟据父元素自适应
HTML布局之左右结构,左边固定右边跟据父元素自适应,兼容IE6+.Firefox.Chrome.Opera.Safari,这里是用表单写的一个demo,其实就在主体布局中也是可以的,比如像后台一些管 ...
- css布局:左边固定宽度,右边自适应宽度或右侧固定,左侧自适应三种方法
方法一:浮动布局 这种方法我采用的是左边浮动,右边加上一个margin-left值,让他实现左边固定,右边自适应的布局效果 HTML Markup <div id="left" ...
- 实现左边div固定宽度,右边div自适应撑满剩下的宽度的布局方式:
html: <div class="container"> <div class="left"> left固定宽度200px </ ...
- 左边label随着右边textarea高度自适应
左边label随着右边自适应 近期项目中,有表单需求 默认展示两列,当内容多的时候,可以展示一列 左边列 <div> <label>备注</label> <s ...
- css布局:左边固定宽度,右边自适应;右边固定宽度,左边自适应
左边固定宽度,右边自适应 浮动布局的方法 <section class="container homeSection" id="mainSection"& ...
- css实现左边定宽右边自适应的5种方法总汇
在网页布局中,通常需要实现左边定宽右边自适应布局,默认html的结构如下: <div class="box"> <div class="left&quo ...
- flex 左边固定宽度,右边自适应
<div id="flex"> <div id="left">我在边,定宽</div> <div id="r ...
随机推荐
- USACO4.4 Frame Up【拓扑排序】
题意居然还读了好久... 读完题目之后大概就知道拓扑排序了.用拓扑可以求出一些字母之间的关系,谁先,谁后.但是这个关系不是唯一确定的,所以就会产生多种方案(题目还要求按字典序输出所有的方案) 输出方案 ...
- CentOS配置java环境,mysql数据库等文章链接
配置jdk 配置jdk 安装mysql8 yum install -y mysql-community-server 安装mysql8 安装redi 安装redis 安装docker 安装docker
- 【C++ 学习笔记】 MFC CEdit
环境:VS2008 -关联变量 方法一:在控件上右键-变量-CEdit类型变量-输入变量名. 方法二:添加代码 头文件中定义变量CEdit m_edit_fileName; 源文件中变量关联DDX_C ...
- aws 基于延迟策略配置dns故障切换
前提:由于国内访问首尔地区经常出现不稳定情况,现将请求从nginx(sz)转发到nginx(hk)再转发到首尔地区,在基于不改变nginx(seoul)的配置的前提下,引入aws的延迟策略,同时保证国 ...
- Windows文件共享配置与遇到的问题
一.Windows 7 访问共享文件权限不足 问题 最近在 Windows 10 上共享了一个文件夹,并创建了一个用户,用于在别人访问该共享文件夹时进行认证,但是在一个同事的电脑(Windows7,当 ...
- 【转贴】龙芯内核发展策略 已经支持k8s
龙芯内核发展策略 时间:2019-06-27 15:48 来源:未知 作者:龙芯中科 点击:1002次 http://www.loongson.cn/m/view.php?aid=1118 ...
- [转帖]etcd 在超大规模数据场景下的性能优化
etcd 在超大规模数据场景下的性能优化 阿里系统软件技术 2019-05-27 09:13:17 本文共5419个字,预计阅读需要14分钟. http://www.itpub.net/2019/ ...
- Fiddle-常用设置和操作记录
1.导出证书: 2.清空屏幕: 3.字段认识 4.保存会话: 5.解码
- Mongo数据库备份
安全访问状态下 手动在线备份: mongodump -h 127.0.0.1:27017 -u=username -p=123456 -d dbname -o /home/backups 手动恢复: ...
- mongodb 数据操作(1)
切换/创建数据库 use test 添加数据db.student.save({name:"J33ack",age:25}) 查看数据库show dbs 删除当前数据库 db.dro ...