line-block的运用最小宽度的设置

网上找到的正规描述：
 引用内容
这个值导致一个元素产生一个块状盒模型（block box），而本身作为单一的内联盒模型（inline box）流动排列（flow），类似一个被替代的元素。Display值为inline-block的元素内部形成一个块状盒模型，而本身形成类似一个内联的被替代元素
PS：可惜IE不支持，FF也不支持。HOHO～

IE解决方案：触发IE的layout，从而使该元素具备类似line-block的特性。

FF解决方案：使用moz专属属性：display::-moz-inline-box;

line-block的运用：最小宽度的设置 - www.jb51.net

测试

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

.box { display:inline; zoom:1; min-width:400px; width:auto!important; width:400px; clear:right; border:1px solid #000; background:#ccc; }
    html:lang(zh-CN) .box { display:-moz-inline-box; } /* moz-ff */

赞 (0)

相关推荐

  • line-block的运用最小宽度的设置

    网上找到的正规描述:  引用内容 这个值导致一个元素产生一个块状盒模型(block box),而本身作为单一的内联盒模型(inline box)流动排列(flow),类似一个被替代的元素.Display值为inline-block的元素内部形成一个块状盒模型,而本身形成类似一个内联的被替代元素 PS:可惜IE不支持,FF也不支持.HOHO- IE解决方案:触发IE的layout,从而使该元素具备类似line-block的特性. FF解决方案:使用moz专属属性:display::-moz-inl

  • PHP setcookie设置Cookie用法(及设置无效的问题)

    结果碰到一个问题,setcookie设置了Cookie并没有生效,在浏览器端也没有看到.查了一下,原来是setcookie是通过HTTP请求响应的Header来完成的,需要在请求响应内容输出之前执行(就像其他Header设定一样). 在php.ini中error_reporting = E_ALL的情况下,输出内容之后再setcookie会弹出以下提示: 复制代码 代码如下: Warning: Cannot modify header information – headers already

  • BlackICE简单设置应用图文教程

    BlackICE简单设置应用图文教程

    BlackICE是一个简单的防火墙软件,虽然你不可以指望他能抵御DDOS之类的攻击,不过抵挡一下那些不学无术的家伙还是合格的.重要的是他有Server版,可以成为服务运行. 本来这个软件设置非常简单,不过依然有人在问,只好逞一下英雄满足一下自己的虚荣心了. 安装BlackICE 这个不需要说什么了吧,请看清楚,在服务器运行的话请使用Server版. 请注意,除非你非常了解并且能很方便的控制机器,这里应该选"AP Off",这里的大意是是否监控可运行程序(包括DLL),如果你在这里选&q

  • java线程阻塞中断与LockSupport使用介绍

    java线程阻塞中断与LockSupport使用介绍

    上周五和周末,工作忙里偷闲,在看java cocurrent中也顺便再温故了一下Thread.interrupt和java 5之后的LockSupport的实现. 在介绍之前,先抛几个问题. Thread.interrupt()方法和InterruptedException异常的关系?是由interrupt触发产生了InterruptedException异常? Thread.interrupt()会中断线程什么状态的工作? RUNNING or BLOCKING? 一般Thread编程需要关注

  • ExtJs使用总结(非常详细)

    一.获取元素(Getting Elements) 1.Ext.get var el = Ext.get('myElementId');//获取元素,等同于document.getElementById('myElementId');//会缓存 2. Ext.fly var el = Ext.fly('myElementId')//不需要缓存. 注:享元模式(Flyweight Design Pattern)是一种节省内存的模式,该模式的大概原理是建立单个全体对象然后不断反复使用它. 3.Ext.

  • AngularJS实现元素显示和隐藏的几个案例

    AngularJS实现元素显示和隐藏的几个案例

    案例一:控制html元素显示和隐藏有n种方法:html的hidden.css的display.jquery的hide()和show().bootstrap的.hide.今天的重点不是显示和隐藏,而是监听某个布尔变量值,自动改变元素显示和隐藏状态.监听函数.if判断.选择dom.设置dom,5行代码搞不定吧,而且毫无技术含量. 看代码: <!DOCTYPE html> <html ng-app> <head> <meta charset="utf-8&qu

  • 微信小程序商城项目之侧栏分类效果（1）

    微信小程序商城项目之侧栏分类效果（1）

    在商场项目中,一般都会有分类页面. 分类页面可以给用户快速找到相关的商品,下面以侧栏分类为例,如下图 布局分析: <主盒子> <左盒子></左盒子> <右盒子></右盒子> </主盒子> 左盒子使用标准流 右盒子使用绝对定位(top.right) wxml: <!--主盒子--> <view class="container"> <!--左侧栏--> <view class

  • li中插入img图片间有空隙的解决方案

    li中插入img图片间有空隙的解决方案

    直接加样式img{vertical-align:bottom; display:block} 当然在某些情况下无效,比如我要加三个图片,上中下,中间的图片是设为背景,发现用此方法无效,只是上和中的图片空隙没了,而下与中之间还存在,方法很简单,把vertical-align:bottom改成top,可根据自己遇到的不同情况来设vertical-align的参数 方法一: 复制代码 代码如下: img{vertical-align:top; display:block} 复制代码 代码如下: <st

  • ReactiveCocoa代码实践之-UI组件的RAC信号操作

    ReactiveCocoa代码实践之-UI组件的RAC信号操作

    相关阅读: ReactiveCocoa代码实践之-更多思考 ReactiveCocoa代码实践之-RAC网络请求重构这一节是自己对网络层的一些重构,本节是自己一些代码小实践做出的一些demo程序,基本涵盖大多数UI控件操作. 一.用UISlider实现调色板 假设我们现在做一个demo,上面有一个View用来展示颜色,下面有三个UISlider滑竿分别控制RGB的色值,随着不同滑竿的拖动上面view的颜色会随之改变. 可以先脑补一下不用RAC该怎么写. 如果使用RAC只需要将三个信号包装起来用适

  • FusionCharts图表显示双Y轴双(多)曲线

    FusionCharts图表显示双Y轴双(多)曲线

    项目中需要FusionCharts图表显示双Y轴,好像FCF_MSLine.swf不可以这样,只能显示一个Y轴,多条线, 找了一下,用MSCombiDY2D.swf可以实现,生成图如下: 两个图表的数据是一样的,设置有一此不同而己 对应的XML文本如下: 复制代码 代码如下: <chart palette='2' caption='图表' rotateNames='0' showValues='0' divLineDecimalPrecision='1' limitsDecimalPrecisi

随机推荐