html - 使容器 <ul> 元素内的所有 <li> 元素具有相同的宽度

标签 html css

我已经为此苦苦挣扎了一天左右,我已经返回并从第一个方 block 开始了几次,但我正在尝试让水平的 css 弹出标题按我想要的方式工作。

当容器扩展以容纳它们时,我想根据需要扩展下拉列表位(如果类别名称强制在一行上会很好)。 fiddle 会更好地解释。

http://jsfiddle.net/HyuLy/

有什么想法吗?

最佳答案

您有一些 width: 100% 会因为您的 padding 而破坏您的布局。 width 是元素的内部宽度,所以当您将 width:100%padding:20px 结合使用时,您的元素现在是100% + 40 像素。

此外,您还有一些不应该存在的 float: left。如果您要垂直堆叠元素,则无需 float: left

看看这个:http://jsfiddle.net/scrimothy/mxW4y/

由于这里发生了很多事情,您可能需要将此 css 复制回您的文本编辑器以便更好地查看它。我删除了一些宽度和 float

关于html - 使容器 <ul> 元素内的所有 <li> 元素具有相同的宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12322965/

相关文章:

javascript - 大小之间的差异 javascript 转换 :scale(? .?)

html - 我怎样才能让这个菜单的 "clear:both"在谷歌浏览器中工作?

javascript - 在 HTML、CSS 和 Javascript 或 Jquery Apple iOS 上单击文本框

html - Inline-block 展开高度父容器

php - Wordpress 响应式主题, Logo 在浏览器中显示不同

javascript - 检查字符串中是否已存在占位符文本

css - Foundation 4 工具提示更改最高值

css - z-index -1 的元素的子元素可以出现在其父元素的父元素之上吗?

html - 在 div 中调整图片大小和对齐图片

javascript - TinyMCE,iframe URL 列表?