妙味茶馆

 找回密码
 注册

QQ登录

只需一步,快速开始

查看: 6131|回复: 10

[求助] 两个span都设置display:inline-block,为什么第一个span会被挤下去

[复制链接]
carol_2014 发表于 2014-12-25 11:42:28 | 显示全部楼层 |阅读模式
如题,两个span都设置display:inline-block,给第二个span加一个overflow:hidden,为什么第一个span会被挤下去??

求助啊,在线等ing
回复

使用道具 举报

motao 发表于 2014-12-25 15:25:32 | 显示全部楼层
加垂直对齐方式
回复 支持 1 反对 0

使用道具 举报

创美易-miaov 发表于 2014-12-25 15:30:05 | 显示全部楼层
motao 发表于 2014-12-25 15:25
加垂直对齐方式

两个span都设置display:inline-block,给第二个span加一个overflow:hidden,为什么第一个span会被挤下去??
他不是问解决方法,是问原因?
回复 支持 反对

使用道具 举报

无为 发表于 2014-12-25 15:39:57 | 显示全部楼层
具体代码提交上来才好帮你分析哈。。
回复 支持 反对

使用道具 举报

创美易-miaov 发表于 2014-12-25 16:30:04 | 显示全部楼层
无为 发表于 2014-12-25 15:39
具体代码提交上来才好帮你分析哈。。

它应该是说这种: QQ图片20141225162847.png

  1. <!doctype html>
  2. <html lang="en-US">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title></title>
  6. </head>
  7. <body>
  8.     <span style="display:inline-block;background:red;overflow: hidden">111111111</span>
  9.     <span style="display:inline-block;background:red;">111111111</span>
  10. </body>
  11. </html>
复制代码



回复 支持 反对

使用道具 举报

花花 发表于 2014-12-30 10:26:39 | 显示全部楼层
<!doctype html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <span style="display:inline-block;background:red;overflow: hidden; vertical-align:middle;">111111111</span>
    <span style="display:inline-block;background:red; vertical-align:middle;">111111111</span>
</body>
</html>
vertical-align值 也可以是其它的如top..
回复 支持 反对

使用道具 举报

 楼主| carol_2014 发表于 2015-1-6 15:31:41 | 显示全部楼层
motao 发表于 2014-12-25 15:25
加垂直对齐方式

恩,知道如何解决,但是不知道为什么会出现这种情况
回复 支持 反对

使用道具 举报

 楼主| carol_2014 发表于 2015-1-6 15:32:47 | 显示全部楼层
创美易-miaov 发表于 2014-12-25 15:30
两个span都设置display:inline-block,给第二个span加一个overflow:hidden,为什么第一个span会被挤下去 ...

是的,知其然,也要知其所以然
回复 支持 反对

使用道具 举报

motao 发表于 2015-1-6 16:56:09 | 显示全部楼层
默认的垂直对齐方式不统一啊
回复 支持 反对

使用道具 举报

创美易-miaov 发表于 2015-1-6 18:54:08 | 显示全部楼层
motao 发表于 2015-1-6 16:56
默认的垂直对齐方式不统一啊

好的~~~
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|Archiver|小黑屋|妙味课堂 ( 京ICP备08102442号

GMT+8, 2019-5-22 07:21 , Processed in 0.153164 second(s), 27 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表