HTML   发布时间:2022-04-14  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了html – 从顶部开始并排排列两个无序列表大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我有两个uls在不同的div中彼此相邻:

DIV {
显示:内联块;
宽度:320像素;
}

<div>
    <ul>
    <li>line 1</li>
    <li>line 2</li>
    </ul>
</div>

  <div>
    <ul>
    <li>line 1</li>
    <li>line 2</li>
    <li>line 3</li>
    <li>line 4</li>
    <li>line 5</li>
    </ul>
  </div>

当两者相邻并且具有相同数量的元素时,这看起来很好,但具有最小项目数的div被推到底部并且看起来非常不对齐.我不确定如何确保顶部div或其顶部对齐,以便子元素等不会出现在底部.

编辑:jsfiddle链接:https://jsfiddle.net/v0bzkhqq/

它看起来像使用vertical-align:text-top;会工作..所以我现在感觉很慢.

解决方法

你可以浮动:离开无序列表并仍然为它们设置宽度.
div {
    float: left;
    width: 320px;
}

这是一个fiddle

更新:

您还可以添加vertical-align:top;如果你想保持显示:inline-block;

div {
    display: inline-block;
    width: 320px;
    vertical-align: top;
}

Fiddle link

大佬总结

以上是大佬教程为你收集整理的html – 从顶部开始并排排列两个无序列表全部内容,希望文章能够帮你解决html – 从顶部开始并排排列两个无序列表所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。