【bug库】Safari浏览器white-space:nowrap不生效

only_do 发布于2019-08-30 15:56 / 3702人阅读

摘要：复现验证浏览器显示例子蓝天白云花朵浏览器显示例子蓝天白云花朵总结文本不会换行，文本会在同一行上连续，直到遇到标签位置浏览器没有对属性生效疑问为什么在浏览器中没有生效呢

问题描述：

上传一个关键词csv文件，以换行符为分割点，上传后将文件内容展示在页面上，
在safari浏览器下显示结果异常，关键词都在一行显示，没有换行

排查原因：

代码里不知怎么添加了white-space:nowrap;这个属性导致了bug现象。

复现验证：

Safari浏览器 显示
例子： 蓝天 白云 花朵

chrome浏览器 显示
例子： 蓝天 
      白云 
      花朵

总结：

 white-space:nowrap;
 文本不会换行，文本会在同一行上连续，直到遇到
标签位置

safari浏览器没有对 white-space:nowrap属性生效

疑问：
为什么在safari浏览器中没有生效呢？

云服务器 GPU云服务器 safari扩展浏览器 safari不支持webrtc Webrtc 不支持safari 缓存不生效

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/117580.html

vue移动端复杂表格表头，固定表头与固定第一列

摘要：固定的表格头部与第一列的宽高行高都是通过获取真实的表格的宽高来设定的。通过展示的表格的上下滚动从而带动固定在第一列的向上滚动，向左右滚动带动覆盖上表头的的左右滚动。 showImg(https://segmentfault.com/img/remote/1460000015798687); 前言最近做移动端的h5项目，要做一个可配置表头的复杂表格，网上找了很久也没什么好方法，结合网上...

sarva 2019-08-23 10:26 评论0 收藏0
图解CSS3读书笔记文本与颜色

摘要：将内容在边界内换行不截断英文单词换行语法浏览器只在半角空格或连字符的地方进行换行。个人感觉跟类似强行截断英文单词，达到词内换行效果。 CSS3文本 css字体类型属性 font-family, font-style(normal、italic、oblique[倾斜]), font-weight, font-size-adjust(定义是否强制对文本使用同一尺寸,仅火狐支持), font...

lvzishen 2019-08-28 18:26 评论0 收藏0
CSS 文本控制

摘要：学习一些文本控制的属性，防止做傻事。是的升级版，当单行文本过长，超过文本边界时自动换行。否则，文本仍然左对齐。 one more time one more chance. 一歩重头学前端, css入门。学习一些 CSS 文本控制的属性，防止做傻事。请大家对照下面列表检验下：会的、不会的、似懂非懂的。笔者是一个也不会。 white-space text-overflow: ell...

Taonce 2019-08-29 15:42 评论0 收藏0
CSS样式

摘要：独孤九剑常用样式首行缩进一个文字大小文字修饰删除线上划线下划线词间距字母间距的区别使用浏览器默认的换行规则。其行为方式类似中的标签。只对英文起作用，以单词作为换行依据。不换行，超出部分隐藏且以省略号形成出现。葵花宝典：【1】相邻的2个margin值会叠加在一起。【2】子元素设定的margin值会影响父元素。在标准浏览器下（FireFox，Chrome，Opera，S...

SwordFly 2019-04-23 11:48 评论0 收藏0
css超过一定长度显示点点

摘要：用来限制在一个块元素显示的文本的行数。为了实现该效果，它需要组合其他的属性。常见结合属性必须结合的属性，将对象作为弹性伸缩盒子模型显示。，可以用来多行文本的情况下，用省略号隐藏超出范围的文本。 Text-overflow: clip | ellipsis作用:文本溢出简单的裁切 Text-overflow: clip 表示不显示省略标记（...），只是简单的裁切，需要配合overflo...

PumpkinDylan 2019-08-29 12:22 评论0 收藏0