inline-block，一个奇怪的问题：中间div掉下来
先上代码：
<!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掉下来的更多相关文章
- DIV+CSS布局问题：一个宽度不确定的DIV里面放三个水平对齐的DIV，左右两个DIV宽度固定为150px，中间那个DIV充满剩余的宽度
一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...
- SpannableString的一个奇怪的问题
今天使用spannableString遇到一个奇怪的问题,就是在setspan的时候,原本可以写成 spannableString.setSpan(new RelativeSizeSpan(0.5f) ...
- MinGW 和 MSVC 下，使用 FILE 类型的一个奇怪的问题
今天遇到一个奇怪的问题. 开发环境: 1. Eclipse CDT,使用 MinGW 的 gcc 编译器和函数库 2. Visual Studio 2008 问题描述: 在 eclipse cdt 中 ...
- 遇到delphi连接sql一个奇怪的问题：未指定的错误，加大了命令的等待时间为600即可了
遇到delphi连接sql一个奇怪的问题:未指定的错误,加大了命令的等待时间为600即可了 找了一下午没解决.
- 【Windows 7】发现一个奇怪的现象
最近在Windows7-32位操作系统上发现一个奇怪的现象,不知道64位操作系统上会不会发生这个现象.这个现象就是:如果系统上的一个或多个账户没有设置密码,那么在此条件下终止winlogon.exe进 ...
- PHP 浮点型转整型的一个奇怪现象
起因 最近通过一个学长的题了解php弱类型的时候,发现了一个奇怪的现象. 正文 主要问题在这样一段代码: $c=(int)((0.1+$b)*10); 当$b=0.6,0.8以及其他值的时候都正常 将 ...
- chrome一个奇怪的问题
我去........... 这牢骚发完了才发现, 多谢了个e 呃................. ================================= 晚上用bootstrap搭建一 ...
- 一个奇怪的JS函数
今天在分析一个jQuery插件源码的时候,发现了一个奇怪的函数. 这个函数的目的是为数字补零,如传入7,输出07,传入12输出12.由于是对时间补零,只截取后两位. // add leading ze ...
- web3部署智能合约碰到的一个奇怪问题
都是gasLimit惹的祸 解决一个奇怪问题Error: Number can only safely store up to 53 bits 原来好好的node endpointtest.js ,结 ...
- (原)关于OpenSL ES播放音频数据的一个奇怪的问题
关于OpenSL ES播放音频数据的一个奇怪的问题 Author:lihaiping1603@aliyun.com 最近用业余时间做了一个android平台的播放器sdk,其中视频用的opengl e ...
随机推荐
- 【转载】Sqlserver阻止保存要求重新创建表的更改
在Sqlserver创建完表table后,后续维护过程中有时候需要往表格中新增字段,在表设计窗体中新增字段后保存,有时候会直接抛出错误信息,提示“不允许保存更改,您所做的更改要求删除并重新创建以下表” ...
- Android Studio 杀掉当前进程
android.os.Process.killProcess( android.os.Process.myPid());
- Syncrhonized 和 Lock的区别和使用
相信很多小伙伴们初学多线程的时候会被这两个名词搞晕,所以这里专门介绍这两种实现多线程锁的方式的区别和使用场景 Synchronized 这个关键词大家肯定都不陌生,具体的用法就是使用在对象.类.方法上 ...
- python进程池
当需要创建的子进程数量不多时,可以直接利用multiprocessing中的Process动态成生多个进程,但如果是上百甚至上千个目标,手动的去创建进程的工作量巨大,此时就可以用到multiproce ...
- Java8 Optional类
概述 到目前为止,著名的NullPointerException是导致Java应用程序失败的最常见原因.过去,为了解决空指针异常,Google公司著名的Guava项目引入了Optional类,Guav ...
- Java马士兵高并发编程视频学习笔记（一）
1.同一个资源,同步和非同步的方法可以同时调用 package com.dingyu; public class Y { public synchronized void m1() { System. ...
- blfs（systemd版本）学习笔记-构建gnome桌面系统
我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 大概思路: lfs(系统)+xorg(驱动)+gnome(桌面组件) 链接: lfs(systemd版本)学习笔记系列:http ...
- jQuery 练习：tab 切换
实现内容随菜单切换 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- spring一些简单小注意知识点
Spring 配置详解 <!-- Bean元素:使用该元素描述需要spring容器管理的对象 class属性:被管理对象的完整类名. name属性:给 ...
- docker研究-2
容器和虚拟机都是一种虚拟化技术,两者的主要区别: 虚拟机占用资源多,启动慢,荣誉步骤多:而容器启动快,占用资源少,体积小.Docker 属于 Linux 容器的一种封装,提供简单易用的容器使用接口.它 ...