先上代码：

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <style>

        html body {

            padding: 0;

            margin: 0

        }

    </style>

</head>

<body>

    <div >

        <div style="width: 30%;background:blue;height: 500px;display: inline-block;font-size: 15px"></div>

        <div style="width:30%;;height: 500px;background: green;display: inline-block;font-size: 15px; ">

        </div>

        <div style="width:30%;background: red;height: 500px;display: inline-block;font-size: 15px"></div>

    </div>

</body>

</html>

运行后效果如下：

图上可以看出，这里存在两个问题：1、div之间有间隙  2、如果在中间添加内容，会出现诡异效果：

怎么解决？

1、解决间隙，把父元素的font-size的设置为0

2、把加内容的的div增加样式：vertical-align:top

注意：不要忘了把中间div加font-size:15px

inline-block，一个奇怪的问题：中间div掉下来的更多相关文章

  1. DIV+CSS布局问题：一个宽度不确定的DIV里面放三个水平对齐的DIV，左右两个DIV宽度固定为150px，中间那个DIV充满剩余的宽度

    一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...

  2. SpannableString的一个奇怪的问题

    今天使用spannableString遇到一个奇怪的问题,就是在setspan的时候,原本可以写成 spannableString.setSpan(new RelativeSizeSpan(0.5f) ...

  3. MinGW 和 MSVC 下，使用 FILE 类型的一个奇怪的问题

    今天遇到一个奇怪的问题. 开发环境: 1. Eclipse CDT,使用 MinGW 的 gcc 编译器和函数库 2. Visual Studio 2008 问题描述: 在 eclipse cdt 中 ...

  4. 遇到delphi连接sql一个奇怪的问题：未指定的错误，加大了命令的等待时间为600即可了

    遇到delphi连接sql一个奇怪的问题:未指定的错误,加大了命令的等待时间为600即可了 找了一下午没解决.

  5. 【Windows 7】发现一个奇怪的现象

    最近在Windows7-32位操作系统上发现一个奇怪的现象,不知道64位操作系统上会不会发生这个现象.这个现象就是:如果系统上的一个或多个账户没有设置密码,那么在此条件下终止winlogon.exe进 ...

  6. PHP 浮点型转整型的一个奇怪现象

    起因 最近通过一个学长的题了解php弱类型的时候,发现了一个奇怪的现象. 正文 主要问题在这样一段代码: $c=(int)((0.1+$b)*10); 当$b=0.6,0.8以及其他值的时候都正常 将 ...

  7. chrome一个奇怪的问题

    我去........... 这牢骚发完了才发现,  多谢了个e 呃................. ================================= 晚上用bootstrap搭建一 ...

  8. 一个奇怪的JS函数

    今天在分析一个jQuery插件源码的时候,发现了一个奇怪的函数. 这个函数的目的是为数字补零,如传入7,输出07,传入12输出12.由于是对时间补零,只截取后两位. // add leading ze ...

  9. web3部署智能合约碰到的一个奇怪问题

    都是gasLimit惹的祸 解决一个奇怪问题Error: Number can only safely store up to 53 bits 原来好好的node endpointtest.js ,结 ...

  10. (原)关于OpenSL ES播放音频数据的一个奇怪的问题

    关于OpenSL ES播放音频数据的一个奇怪的问题 Author:lihaiping1603@aliyun.com 最近用业余时间做了一个android平台的播放器sdk,其中视频用的opengl e ...

随机推荐

  1. Kafka安装与配置（windows）

    作者:灬花儿灬 出处:http://www.cnblogs.com/flower1990/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则 ...

  2. Laravel5性能优化技巧

    分享一些 Laravel 开发的最佳实践,还有调优技巧,后面陆续整理中 1.配置缓存信息 使用laravel自带的artisan命令,将所有config里面的配置都缓存到一个文件里. php arti ...

  3. SpringBoot 之基础学习篇.

    一.概念简介 SpringBoot 的关键词是“约定俗成”,它根据长久以来的 Spring 开发配置经验,整理出一套适用.普遍.大家都认可的配置方案.所以 SpringBoot 的学习过程中心态一定要 ...

  4. Module的加载实现

    烂笔头开始记录小知识点啦- 浏览器要加载 ES6模块,: <script type="module" src="./foo.js"></scr ...

  5. .Net Mvc 异步编程

    关于在mvc/webapi 中 async/await 异步编程的探究和整理 你可以用双手玩转多个球 查看调试器windbg和sos.dll调试器扩展或挖掘W3SVC日志 设置minWorkerThr ...

  6. node起步

    首先,在项目目录下创建一个叫 app.js 的文件,并写如以下代码: app.js const http = require('http'); const hostname = '127.0.0.1' ...

  7. 2017-11-07 中文代码示例之Angular入门教程尝试

    "中文编程"知乎专栏原址 原文: 中文代码示例教程之Angular尝试 为了检验中文命名在Angular中的支持程度, 把Angular官方入门教程的示例代码中尽量使用了中文命名. ...

  8. Python property使用简介

    property使用简介 by:授客 QQ:1033553122 功能简介 1) 把类方法变成只读属性 2) setter和getter的另一种实现 代码演示1 #!/usr/bin/env pyth ...

  9. Ubuntu-Tweak 安装

    Ubuntu Tweak 是中国人开发的一款专门为Ubuntu准备的配置.调整工具,类似与compiz,界面更友好.   下面是安装命令:   第一步:添加tweak源 sudo add-apt-re ...

  10. (网页)jQueryAJAXtimeout超时问题详解(转)

    先给大家分析下超时原因: 1.网络不通畅. 2.后台运行比较慢(服务器第一次运行时,容易出现) 超时结果:JQ中 timeout设置请求超时时间. 如果服务器响应时间超过了 设置的时间,则进入 ERR ...