CSS代码

.wrapper1_4 {
width: 100%; /* 也可以固定宽度 */
height: 26px;
}
.wrapper1_4 > .left {
display: inline-block; /* 如需支持IE8以下版本,用浮动来做 */
width: calc(8%); /* 此处运用了一个css3的表达式,将div三等分,IE8及以上可以支持,当然也可以根据需要设置固定值 */
width: -webkit-calc(8%);
width: -moz-calc(8%);
height: 100%;
text-align: center;
}
.wrapper1_4 > .right {
display: inline-block; /* 如需支持IE8以下版本,用浮动来做 */
width: calc(28%); /* 此处运用了一个css3的表达式,将div三等分,IE8及以上可以支持,当然也可以根据需要设置固定值 */
width: -webkit-calc(28%);
width: -moz-calc(28%);
height: 100%;
}

Html

<div class="wrapper1_4">
<div class="left">
lable1:
</div>
<div class="right">
<input type="text" />
</div>
<div class="left">
lable2:
</div>
<div class="right">
<input type="text" />
</div>
</div>

Div不用float布局的更多相关文章

  1. div css float布局用法

    float的应用与用法 想要知道float的用法,首先你要知道float在网页中的用处. 浮动的目的就是为了使得设置的对象脱离标准文档流. 什么是标准文档流? 网页在解析的时候,遵循于从上向下,从左向 ...

  2. 常见div+css网页布局(float,absolute)

    网页布局-常见 1,           float布局 (1)常规方法 <div id="warp">     <div id="column&quo ...

  3. css实现div两列布局——左侧宽度固定,右侧宽度自适应(两种方法)

    原文:css实现div两列布局--左侧宽度固定,右侧宽度自适应(两种方法) 1.应用场景 左侧一个导航栏宽度固定,右侧内容根据用户浏览器窗口宽度进行自适应 2.思路 首先把这个问题分步解决,需要攻克以 ...

  4. 【转】一个DIV+CSS代码布局的简单导航条

    原文地址:http://www.divcss5.com/shili/s731.shtml 简单的DIV CSS代码布局实现导航条 一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现. ...

  5. HTML CSS + DIV实现整体布局

    HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Con ...

  6. CSS布局:Float布局过程与老生常谈的三栏布局

    原文见博客主站,欢迎大家去评论. 使用CSS布局网页,那是前端的基本功了,什么两栏布局,三栏布局,那也是前端面试的基本题了.一般来说,可以使用CSSposition属性进行布局,或者使用CSSfloa ...

  7. line-block代替float布局;

    line-block代替float布局: 我们先看看float的一些特性(特征) 当我们改变浏览器的大小会出现这样的效果: 或则这样: 有时候,我们希望,以第一排最高的元素为换行基准时,我们就可以使用 ...

  8. HTML CSS + DIV实现局部布局

    HTML CSS + DIV实现局部布局 HTML CSS + DIV实现局部布局 1.本章教大家掌握2种布局方式: 1)顶部导航菜单布局,效果图: 2)购物版块布局,效果图: 2.技术目标: 使用d ...

  9. 转:CSS布局:Float布局过程与老生常谈的三栏布局

    使用CSS布局网页,那是前端的基本功了,什么两栏布局,三栏布局,那也是前端面试的基本题了.一般来说,可以使用CSSposition属性进行布局,或者使用CSSfloat属性布局.前者适合布局首页,因为 ...

随机推荐

  1. ODAC(V9.5.15) 学习笔记(十)TVirtualTable

    名称 类型 说明 Options TVirtualTableOptions 选择项,包括: voPersistentData:在数据集关闭时不处理其相关数据内容 voStored:设计期对数据集的处理 ...

  2. String comparison is too slow in R language

    ## String comparison is too slow in R language ## it will take 3 minutes, it is too slow date() strA ...

  3. P2153 [SDOI2009]晨跑

    思路 典型的最小费用最大流问题,拆点,每个点对应的入点和出点之间连一条cap=1的边表示只能经过一次的限制条件 然后其他边从u的出点连向v的入点即可 代码 #include <cstdio> ...

  4. P2504 [HAOI2006]聪明的猴子

    思路 最小生成树中最大的边,边权最小 所以这题就变成最小生成树的板子了,跳跃距离大于最大边权的猴子就是可行的 代码 #include <cstdio> #include <algor ...

  5. mysql中between...and..的使用,及时间范围的查询

    博主原创,转载注明出处: 在mysql应用中,以范围进行查询的很多是以时间范围作为条件进行范围查询的,时间范围查询有 很多种写法,首先总结一下between....and...的使用方法: <s ...

  6. function CONVERSION_EXIT ****INPUT/OUTPUT说明

    CONVERSION_EXIT_ALPHA_INPUT和CONVERSION_EXIT_ALPHA_OUTPUT 函数说明 CONVERSION_EXIT_MATN1_INPUT 物料号码转换函数 C ...

  7. Ubuntu16.04更新记

    大概一周前因为不可抗因素,我再次安装了Ubuntu16.04LTS 对于之前发誓不想再用Ubuntu的我,我只想说一句:真香 写一点我现在Ubuntu的配置,方面自己以后查看,也方便如果有相同需求的人 ...

  8. git服务器搭建全程

    为了后续安装能正常进行,我们先来安装一些相关依赖库和编译工具 [root@VM_95_113_centos ~]# yum install curl-devel expat-devel gettext ...

  9. 极简 R 包建立方法--转载

    https://cosx.org/2013/11/building-r-packages-easily/ 最近想试一下捣腾一个 R 包出来,故参考了一些教程.现在看到的最好的就是谢益辉大大之前写过的开 ...

  10. MVC杂记

    @{ Layout = “…”} To define layout page Equivalent to asp.NET master-page 要定义相当于ASP.Net母版页的页面布局 @mode ...