文章/答案/技术大牛

发布

社区首页 >问答首页 >为什么文本元素的位置是随机的？

问为什么文本元素的位置是随机的？
EN

Stack Overflow用户

提问于 2021-03-13 17:39:32

回答 1查看 34关注 0票数 1

谁能解释一下为什么这些(文本1-5)不是在彼此下面，而是随机放置？(屏幕截图如下)

.container1{
  background-color: #f1f1f1;
  height: 150px;
  width: 150px;
  padding: 20px;
  border: 1px solid #bfbfbf;
  margin: 10px;
}


.container-fluid{
  position: fixed;
  float: right;
  padding-left: 320px;
  padding-right: 20px;
}


.wrapper .sidebar{
  position: fixed;
  width: 300px;
  height: 100%;
  background: #f1f1f1;
  border: 1px solid #bfbfbf;
}

.wrapper .sidebar ul li a{
  color: black;
}

h5{
  padding-top: 10px;
  padding-left: 10px
}

<body>
<div class="wrapper">
  <div class="sidebar">
    <ul><li>Text-1</li></ul>
    <ul><li>Text-2</li></ul>
    <ul><li>Text-3</li></ul>
    <ul><li>Text-4</li></ul>
    <ul><li>Text-5</li></ul>
  </div>
</div>
<div class="container-fluid">
  <div class="row">
    <div class="container1 col-md-2 col-sm-2 col-xs-3"></div>
    <div class="container1 col-md-2 col-sm-2 col-xs-3"></div>
    <div class="container1 col-md-2 col-sm-2 col-xs-3"></div>
    <div class="container1 col-md-2 col-sm-2 col-xs-3"></div>
    <div class="container1 col-md-2 col-sm-2 col-xs-3"></div>
  </div>
</div>
</body>

这是它看起来的样子

html

css

twitter-bootstrap

bootstrap-4

twitter-bootstrap-3

回答 1

Stack Overflow用户

发布于 2021-03-13 20:25:11

你可以尝试在侧边栏和侧边栏ul中使用flex吗？

.sidebar {
    display: flex;
    flex-direction: column;
}

.sidebar ul {
    display: flex;
    flex-direction: column;
}

但是，当我在w3schools中运行您的代码时，它工作得很好。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/66611984

复制

相似问题

问为什么文本元素的位置是随机的？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么文本元素的位置是随机的？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么文本元素的位置是随机的？
EN