热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

在带有浮动元素的表头上使用nowrap?

我有一个包含在可滚动div中的表,并且希望列标题不换行。问题来自TH标签中的floa

我有一个包含在可滚动div中的表,并且希望列标题不换行。问题来自TH标签中的float元素。我希望标题中的SPAN浮动到右侧,但会换行。我尝试将文本和跨度包装在div中,但这没有帮助。想法?

https://jsfiddle.net/e0wn7986/2/


.wrapper {
width: 400px;
overflow: auto;
background: gray
}
table thead tr th {
white-space: nowrap;
}
table thead tr th span {
float: right
}




















Some Column
This is another
One more time
testing some long stuff foobar moobar wizzle wuzzle lets go on and on and on...lets go on and on and on...







我建议使用标签而不是span:

.wrapper{width:400px;overflow:auto;background:gray}
table thead tr th{white-space: nowrap;}
table thead tr th label{float:right}


推荐阅读
  • salesforce lightning零基础学习(七) 列表展示数据时两种自定义编辑页面
    上一篇Lightning内容描述的是LDS,通过LDS可以很方便的实例化一个对象的数据信息。当我们通过列表展示数据需要编辑时,我们常使用两种方式去处理编辑页面:PopUpWindo ... [详细]
  • 本文分析和介绍了GLo ... [详细]
  • One Stage目标检测
    在计算机视觉中,目标检测是一个难题。在大型项目中,首先需要先进行目标检测,得到对应类别和坐标后,才进行之后的各种分析。如人脸识别,通常是首先人脸检测,得到人脸的目标框,再对此目标框 ... [详细]
  • WebBrowser控件(1)
    WindowsPhone7内置了一个强大的网络浏览器,该浏览器的内核是基于桌面版的InternetExplorer7(Mango版基于InternetE ... [详细]
  • python基础(二、pycharm安装、卸载)
    3.在Ubuntu中安装PyCharmPyCharm的官方网站地址是:https:www.jetbrains.compycharm注意:安装时不要使用root用户安装,否则后期使用 ... [详细]
  • spotify engineering culture part 1
    原文,因为原视频说的太快太长,又没有字幕,于是借助youtube,把原文听&打出来了。中文版日后有时间再翻译。oneofthebigsucceessfactorshereatSpo ... [详细]
  • iOS之富文本
    之前做项目时遇到一个问题:使用UITextView显示一段电影的简介,由于字数比较多,所以字体设置的很小,行间距和段间距也很小,一大段文字挤在一起看起来很别扭,想要把行间距调大,结 ... [详细]
  • 论文阅读及复现 | Improved Semantic Representations From TreeStructured Long ShortTerm Memory Networks
    两种形式的LSTM变体Child-SumTree-LSTMsN-aryTree-LSTMshttps:paperswithcode.compaperimproved-semanti ... [详细]
  • C#的Type对象的简单应用
    通过Type对象可以获取类中所有的公有成员直接贴代码:classMyClass{privatestringname;privateintid;publicstringcity;pu ... [详细]
  • linux文件系统和挂载
    创建ISO文件cpdevcdrom目的地.isomkfs命令生成对应·的文件系统但是使用mkfs没有办法修该生成的系统文件的某些特性,例如标记LABEL,如果强行修改会导致文件里面 ... [详细]
  • 这篇文章主要介绍“CSS浮动和定位属性介绍”,在日常操作中,相信很多人在CSS浮动和定位属性介绍问题上存在疑惑,小编查阅了各式资料,整理出简单 ... [详细]
  • fromkeras.modelsimportSequentialfromkeras.layersimportDense,Dropoutfromkeras.layersimp ... [详细]
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • Fixes#3560Itriedtodowhatproposedintheissue(inthisbranchhttps://gith ... [详细]
  • 开发笔记:googletest安装与使用
    本文由编程笔记#小编为大家整理,主要介绍了googletest安装与使用相关的知识,希望对你有一定的参考价值。简介googletest是Google公司 ... [详细]
author-avatar
大瑞Y
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有