dispaly:-webkit-box 布局中的坑
dispaly:-webkit-box 具体用法 这里大家可以网上查,
这里说下里面的坑
里面的子对象设置-webkit-box-flex: 1 -webkit-box-flex: 2 时;一般两个子元素宽度并不是1比2
所以这里建议设置成传统的百分比的形式
-webkit-box-flex: 1 用来做宽度自适应
比如一个左边200px宽 右边自适应,可以这
.parent{
dispaly:-webkit-box ;
}
.left{
dispaly:-webkit-box ;
}
.right{
-webkit-box-flex: 1 ;
}
<div class="parent">
<div class="left"></div><div class="right"></div>
</div>
dispaly:-webkit-box 布局中的坑的更多相关文章
- box布局中文字溢出问题
如果不设置-webkit-box-flex:1:会溢出,设置width也行,在电脑上模拟可能会有问题,手机上没问题
- Box布局
import sys from PyQt4 import QtCore, QtGui class MainWindow(QtGui.QWidget): def __init__(self, paren ...
- PyQt4 Box布局
使用布局类别方式的布局管理器比绝对方式的布局管理器更加灵活实用.它是窗口部件的首选布局管理方式.最基本的布局类别是QHBoxLayout和QVBoxLayout布局管理方式,分别将窗口部件水平和垂直排 ...
- C-Flex 与 box布局教程
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html -阮一峰老师 http://www.w3cplus.com/css3/flexbox- ...
- 在网页布局中合理使用inline formating context(IFC)
引子:给大家出一个小小的考题,如何使用css来实现类似下面的在指定区域内,内容自适应的垂直居中.
- CSS弹性盒模型flex在布局中的应用
× 目录 [1]元素居中 [2]两端对齐 [3]底端对齐[4]输入框按钮[5]等分布局[6]自适应布局[7]悬挂布局[8]全屏布局 前面的话 前面已经详细介绍过flex弹性盒模型的基本语法和兼容写法, ...
- 响应式布局中的CSS相对量
一个响应式布局,要能够根据设备屏幕尺寸的改变,动态的调整页面内容,展现不同的设计风格. 在进行响应式的 CSS 代码编写过程中,经常会用到一些相对尺寸,以达到相对定位的目的.例如,常见的响应式布局中需 ...
- CSS布局中最小高度的妙用
CSS布局中最小高度的妙用 --最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持BOX的高度为一定,超出就自动向下延伸最小高度可以设定一个BOX的最小高度,当其内容较少时时,也能保持B ...
- 在布局中使用android.support.v4.app.Fragment的注意事项
1.Activity必须继承android.support.v4.app.FragmentActivity 2.fragment标签的name属性必须是完全限定包名,如下: <LinearLay ...
随机推荐
- 【转】Android手机分辨率基础知识(DPI,DIP计算)
1.术语和概念 术语 说明 备注 Screen size(屏幕尺寸) 指的是手机实际的物理尺寸,比如常用的2.8英寸,3.2英寸,3.5英寸,3.7英寸 摩托罗拉milestone手机是3.7英寸 A ...
- hyper-net、ion、skip connection、fpn
resnet的skip connection用的也是eltwise相加 fpn的浅层和高层融合用的eltwise相加 hyper-net和ion都是使用的concat的方式 hyper-net网络结构 ...
- 使用vba doc转docx
创建vbs文件,doctodocx.vbs内容如下: '创建一个word对象 set wApp=CreateObject("word.Application") '获取文件传递到参 ...
- [luoguP1443]马的遍历
首先来看一下题目描述: 题目描述 有一个n*m的棋盘(1<n,m<=400),在某个点上有一个马,要求你计算出马到达棋盘上任意一个点最少要走几步 输入输出格式 输入格式: 一行四个数据,棋 ...
- java交换两个值的三种方法 经典
1.中间变量(在开发中常用) int c=a; a=b; b=c; System.out.println("a的值: "+a+" b的值: "+b); 2.按位 ...
- P1247 取火柴游戏
题目描述 输入k及k个整数n1,n2,-,nk,表示有k堆火柴棒,第i堆火柴棒的根数为ni:接着便是你和计算机取火柴棒的对弈游戏.取的规则如下:每次可以从一堆中取走若干根火柴,也可以一堆全部取走,但不 ...
- C++调用WMI类查询获取操作系统名
#define _WIN32_DCOM #include <iostream> #include <comdef.h> #include <Wbemidl.h> u ...
- 微信订阅号 获取用户基本信息,登录及 php
<?php //echo file_get_contents("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_cr ...
- JDK1.8的安装
[环境准备] OS版本:Windows10企业版.64位操作系统: JDK版本:jdk-8u131-windows-x64.exe [彻底卸载已安装的JDK] 01:卸载或删除JDK服务.有三种方式: ...
- Cygwin安装篇,windows平台上运行的类UNIX模拟环境
1.虚拟光驱的安装 虚拟光驱下载 一路下一步,不再阐述,这些广告选项不要选 2.安装文档,双击ISO文档 ISO下载地址 链接:http://pan.baidu.com/s/1miFVCYO 密码:z ...