背景 块级元素宽度默认值为100%，而不是auto;因此其宽度不会根据子元素内容动态适应。 如何实现父级元素宽度动态适应其子元素。 方法一 display:inline; 给块级元素设置inline-block值。 方法二 绝对定位元素 给块级元素设置position ...

直接添加`width: max-content;`声明就 OK，之前太单纯了。 * * * 最近碰见这样一个需求，要让图片横向排列设置 x 方向的滚动条滚动查看，原本当直接创建一个 IFC（inline，float 什么的）就解决了，搞了半天发现搞不定（IFC 也是不能父元素宽度自适应子元素宽度 ...

1、在最后一个子元素后面清除浮动 2、父元素加over-flow:hidden;(副作用：子元素定位不能超出父元素的范围) 3、父元素也一样浮动(最笨的方法)； 4、子元素使用inline-block;代替浮动； ...

需求：1.父级div不设置高度 　　　2.图片高度自适应，并且显示为正方形； 以前遇到列表中图片高度必须和父级宽度相同，并且需要为正方形的时候，最开始的方法是定死图片高度，这样会导致不同分辨率下图片会压缩，后来傻傻的用js来控制图片的高度，直到现在才明白几句css就能搞定，并且完全符合 ...

正常情况 如果子元素没有设置浮动（float），父元素的高度会随着子元素高度的改变而改变的。 设置浮动以后 父元素的高度不会随着子元素的高度而变化。 例如：在一个ul中定义若干个li，并设置float='left' 显示结果就会是这样： 解决办法 最简单的方法是，给父元素 ...

　　好久没写博客了，最近捡起前端代码开始码，一些基本的东西都忘记了，觉得自己停滞不前的原因就是没做好巩固——废话 　　我们常常在做盒子嵌套的时候，最外层盒子不想给他设置高度，因为我们填充的内容不确定有多大，一般就选择auto自适应。 　　然，子级盒子又是一个嵌套或者样式复杂点，超出父级盒子 ...

对于字符串，可以通过 white-space:no-wrap 来控制，溢出父元素时，不换行，但是对于块级元素，并没有这样的属性，如图： CSS： HTML: 子元素，110px+110px+间隙 超出了父元素 200px 的宽，就自动换行了，即使换成 float 也是一样的情况 ...

当最外面的层想要设置一个 overflow: hidden，但子元素又想他们能滚动，像今日头条的滚动导航一样： html： css： 这样写里面的子元素 scroll的宽度就可以随着li的增加减少而改变，在这里引用iscroll可以向右滑动 ...