父元素设置固定宽度并设置overflow:scroll,如何让子元素撑开父元素
<div class=“a”> <div class=“b”>
<div class=“c”>内容内容,很长的内容</div>
</div></div>
给a设定一个固定宽度,并设定overflow:scroll,使其出现横向滚动条,但文字内容会自动换行,为了不换行,我给c设定white-space:nowrap,虽然达到了效果,可以完整显示内容,并出现滚动条,但实际上a和b的宽度并不会完整包裹c(给a和b设定背景色就能看出),而是与原先设定的宽度一样。有什么办法让a和b的宽度能正常包裹c呢?
原先无法让b完全包裹c,只要给b加上:float: left;让它脱离a的文档流,b的宽度就不受a限制了,即使a设置了滚动条,b的宽度也能自适应了。
http://jsbin.com/zobiyogepo/edit?html,css,output
父元素设置固定宽度并设置overflow:scroll,如何让子元素撑开父元素的更多相关文章
- 内层元素设置position:relative后父元素overflow:hidden overflow:scroll失效 解决方法
内层元素设置position:relative后父元素overflow:hidden overflow:scroll 都失效 解决方法:在position:relative的外层父容器加positio ...
- [转] 设置div的overflow:scroll,但是在手机上滑动的时候有点卡顿
设置div的overflow:scroll,但是在手机上滑动的时候有点卡顿,所以在这个div上加一个css: -webkit-overflow-scrolling : touch; 在苹果手机上使用- ...
- CSS中overflow:scroll怎么设置只上下滚动而不左右滚动
CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...
- ie6下内容会撑开父级设置好的宽高
在ie6下,内容的宽高会撑开父级设置好的宽高,在其他浏览器下不会. 会出现的问题是:如果内容宽度大于父级设置好的宽度,内容的最后一个元素会换行显示. 注意:在计算时,务必做到精准,不然可能会产生不必要 ...
- pages 元素(ASP.NET 设置架构)web.config 详解
pages 元素(ASP.NET 设置架构) buffer="[True|False]" enableEventValidation="[True|False] ...
- roleManager 元素(ASP.NET 设置架构),我是因为SSL弱密码(转)
为角色管理配置应用程序. 此元素是 .NET Framework 2.0 版中的新元素. configuration 元素(常规设置架构) system.web 元素(ASP.NET 设置架构) ...
- compilation 元素(ASP.NET 设置架构)
配置 ASP.NET 用于编译应用程序的所有编译设置. <configuration> 元素 system.web 元素(ASP.NET 设置架构) compilation 元素( ...
- authorization 元素(ASP.NET 设置架构)
authorization 元素(ASP.NET 设置架构) 其他版本 1(共 1)对本文的评价是有帮助 - 评价此主题 [本文档仅供预览,在以后的发行版中可能会发生更改.包含的空白主题用作占位符.] ...
- 在IE6里面当元素浮动后再设置margin那么就会产生双倍边距
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- K8S从入门到放弃系列-(11)kubernetes集群网络Calico部署
摘要: 前面几个篇幅,已经介绍master与node节点集群组件部署,由于K8S本身不支持网络,当 node 全部启动后,由于网络组件(CNI)未安装会显示为 NotReady 状态,需要借助第三方网 ...
- 数据结构 -- 哈希表(hash table)
简介 哈希表(Hash table,也叫散列表),是根据关键码值(Key value)而直接进行访问的数据结构.也就是说,它通过把关键码值映射到表中一个位置来访问记录,以加快查找的速度.这个映射函 ...
- Django多对多关系建立及Form组件
目录 Django多对多关系 1.创建方式一全自动 2.创建方式二纯手撸 3.半自动(推荐使用) forms校验组件 使用forms组件实现注册功能 form常用字段和插件 数据校验 钩子函数 HOO ...
- 谈谈Python中pop与remove的用法
remove() 函数用于移除列表中某个值的第一个匹配项. remove()方法语法: list.remove(obj) 如果obj不在列表中会引发 ValueError 错误,通常先使用count ...
- 5-9 c语言之【初识win32编程】
---恢复内容开始--- 今天学习了win32的相关知识,首先win32是指是指可以在32位或以上Windows系统中运行的程序,我学习的主要利用c/c++语言编写的win32程序, 首先在win32 ...
- harbor关联k8s
第一步 在harbor上创建用户,项目,将用户添加到对应项目中,并赋予用户项目管理者或者开发人员权限,使其对镜像仓库有读写权限. 本次部署创建用户liusw,密码Lsw123456,邮箱8730017 ...
- Python操作Redis(转)
原文1:https://cloud.tencent.com/developer/article/1151834 原文2:https://www.cnblogs.com/zhaohuhu/p/91406 ...
- 夯实基础:彻底搞清楚Cookie 和 Session 关系和区别(转)
原文地址:http://www.sohu.com/a/281228178_120047080 网络请求中的cookie与set-Cookie的交互模式和作用:https://my.oschina.ne ...
- JDBC 复习4 批量执行SQL
1使用jdbc进行批量执行SQL在实际的项目开发中,有时候需要向数据库发送一批SQL语句执行,这时应避免向数据库一条条的发送执行,而应采用JDBC的批处理机制,以提升执行效率. package dbe ...
- matlab cell
cell元包是matlab中提供的一种数据类型,功能强大. 关于cell的创建: 1.跟一般创建举证一样,直接使用C = {A B D E}这种形式,不过这里把"[]"改成了}&q ...