1==》如何让div里面的元素在【垂直 方向】上水平分布
.important-dec{
height: 121px; //必须固定高度
flex-direction: column; //垂直排列
display: flex;
justify-content: space-between;
}

2==》使用 calc() 函数计算 <div> 元素的宽度:
需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px);
任何长度值都可以使用calc()函数进行计算;
calc()函数支持 "+", "-", "*", "/" 运算;
calc()函数使用标准的数学运算优先级规则;

width: calc(100% - 210px);

div里面的元素在【垂直 方向】上水平分布 使用calc()函数动态计算的更多相关文章

  1. 《在纹线方向上进行平滑滤波,在纹线的垂直方向上进行锐化滤波》 --Gabor增强的具体实践

    <在纹线方向上进行平滑滤波,在纹线的垂直方向上进行锐化滤波>                                          --Gabor增强的具体实践     一.问 ...

  2. HTML-移动端如何使用css让百分比布局的弹窗水平和垂直方向上居中

    pc端让一个弹窗水平和垂直方向居中,在知道弹窗宽高的情况下很好计算,只需要用如下css即可: #date{ width: 300px; height: 300px; position: absolut ...

  3. 触发bfc解决父子元素嵌套垂直方向margin塌陷问题

    首先看一下问题案例 .wrapper{             width: 100px;             height: 100px;             background-colo ...

  4. Div 内部所有元素 全部垂直对齐

    http://stackoverflow.com/questions/7273338/how-to-vertically-align-an-image-inside-div How it works: ...

  5. HTML5 移动端如何使用css让百分比布局的弹窗水平和垂直方向上居中

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Html中让输入框input和紧接在后的按钮button在垂直方向上对齐

    <table border="0px" width="360px"> <tr><td colspan="10" ...

  7. div里面的元素垂直均匀分布 按钮引发地址栏出现问号 判断一个数组是否为空 div底部居中 路由传参接受参数

    一个固定高度的div的子元素 在垂直 方向上平均分布 .important-dec{ height: 121px; flex-direction: column; display: flex; jus ...

  8. 行盒(line box)垂直方向的属性详解:从font-size、line-height到vertical-align

    视觉格式化模型 在一个文档中,每个元素都被表示为0.1或多个矩形的盒子.确定这些盒子的尺寸, 属性 --- 像它的颜色,背景,边框方面 --- 和位置是渲染引擎的目标.① 在CSS中,使用标准盒模型描 ...

  9. css 垂直方向 margin 边距 重合

    1:控制两个相邻边盒子之间的距离,在A或者B盒子上用margin控制,就可以控制距离了. 2:父子级之间的元素,常规文档流中,只要垂直外边距直接接触就会发生合并.比如在写header标签时,想移动he ...

随机推荐

  1. 对《Java核心技术卷一》读者的一些建议

    <Java核心技术卷一>是唯一可以和<Java编程思想>媲美的一本 Java 入门书.单从技术的角度来看,前者更好一些.但上升到思想层面嘛,自然后者更好,两者的偏重点不同. 思 ...

  2. react + typescript 学习

    react,前端三大框架之一,也是非常受开发者追捧的一门技术.而 typescript 是 javascript 的超集,主要特点是对 类型 的检查.二者的结合必然是趋势,不,已经是趋势了.react ...

  3. 红黑树原理详解及golang实现

    目录 红黑树原理详解及golang实现 二叉查找树 性质 红黑树 性质 operation 红黑树的插入 golang实现 类型定义 leftRotate RightRotate Item Inter ...

  4. visual studio 的快键键(持续更新)

    目录 1. CTRL+ Tab 2. Prop+ Tab 3. CTRL+. 4. 断点相关 5.快速搭建类的构造函数 6.查看需要引用的包 1. CTRL+ Tab 自动生成无参构造函数 2. Pr ...

  5. 记一次在node.js中使用crypto的createCipheriv方法进行加密时所遇到的坑

    Node.js的crypto模块提供了一组包括对OpenSSL的哈希.HMAC.加密.解密.签名,以及验证等一整套功能的封装.具体的使用方法可以参考这篇文章中的描述:node.js_crypto模块. ...

  6. Docker 中卷组管理

    一.概念 数据卷是一个可供一个或多个容器使用的特殊目录实现让容器的一个目录和宿主机中的一个文件或者目录进行绑定.数据卷 是被设计用来持久化数据的,对于数据卷你可以理解为NFS中的哪个分享出来的挂载点, ...

  7. VS2017创建的单元测试不支持顺序测试

      问题:使用IDE创建的单元测试项目,标准引用是,导致不能添加顺序测试,复制其它项目的顺序测试文件进行编辑时,也会提示基于MSTest V2的测试不能用于顺序测试     解决办法: 移除自带的NU ...

  8. 学习之Redis(二)

    Redis的对象和数据结构 一.字符串对象(请参考学习之Redis(一):https://www.cnblogs.com/wbq1994/p/12029516.html) 二.列表对象 列表对象的编码 ...

  9. Oracle DB Time

    Oracle DB Time是Oracle数据库在时间维度上剖析性能的一个重要指标,通过逐级分解该指标,定位到浪费资源或者资源争用的首要事件上,从而通过减少等待以及最小化每个请求的使用资源来达到优化的 ...

  10. subprocess之check_out用法

    在python3中使用subprocess的check_out方法时,因为该输出为byte类型,所以如果要查看具体的内容时需要进行转码,如果转码不对话,会影响内容输出的可读性,如下: #1,输出解码不 ...