Html 我的<；ul>；元素位于容器外部

目前我正在制作一个包含图像的列表。它几乎可以工作，但我有一个问题。我的列表没有放在容器中，而它应该放在容器中。这里有一些代码

<div class="container">
<ul>
<li>
<div class="person1test">
  <div class="personOverlay">
  <div class="info"><span class="naam"> text </span>
  <span class="functie"> text </span></div>
 </div>
 </div></li>
<li>
<div class="person1test">
 <div class="personOverlay">
  <div class="info"><span class="naam">text </span>
   <span class="functie"> text </span></div>
  </div>
  </div></li>
<li>
<div class="person1test">
 <div class="personOverlay">
  <div class="info">
   <span class="naam"> text </span>
   <span class="functie">text</span></div>
</div>
</div></li>

</ul>
     <div class="clearer"></div>
 </div>

---

我希望我能清楚地说明我的问题是什么，因为英语不是我的主要语言。

您应该将

的高度设置为自动。它会解决您的问题。

错误：此css

.container ul{
  width: 130%;
  overflow: hidden;
  list-style-position: inside;
}

将

ul

的宽度设置为容器宽度的130%。这意味着，如果容器是100px，ul将是130px，并且明显地从容器中移出。将

ul宽度设为100%

，但如果ul上留有一些填充或空白（比如说10px），那么由于它必须是100px宽，它将超出容器，使其看起来像总的110px

解决方案：

---

因此，请将宽度设置为100%，然后删除边距和填充物，或者保留边距和填充物，并将宽度设置为90%左右，这样可以修复您的UI。

我使用了此代码，它似乎工作正常。你有小提琴吗？或者是缺少一些代码？（如果可以，请提供所有css和html）我检查了它是否正常工作。嗨，我已经复制了你的代码并看到了输出。它工作得很好，除了

的宽度大于容器

我的
元素在容器的外面，如果你说的是UI，那么它是因为
.container ul{width:130%；}
嘿，这很奇怪。它正在处理JS小提琴。然而，在我的Wordpress页面上，如果我检查元素，
从容器中掉出来，我可以尝试发送一个屏幕截图或其他东西？我已经将ul的宽度设置为75%，现在它又在容器div中了。但是现在我不能把所有这些图片都放在我想要的地方。有没有办法把所有的图片都放在一条线上，并保存在div中？这是一张我的照片：。ul的背景是红色的，容器是蓝色的。你需要给ul设置一个高度，然后说溢出隐藏。我给ul添加了一个高度，它已经有一个溢出：隐藏。这似乎没有任何帮助。我现在觉得很笨，因为小提琴起作用了。我是否应该重新开始，也许那一次能奏效？这是另一个我猜你的ul正在改变它的风格。检查检查员，看看发生了什么事！事实上是这样！element.style标记中没有显示任何内容。这可能就是问题所在，我只需要找出我现在必须使用的选择器，正如你们所看到的，我对这个很陌生。
.container ul{
  width: 130%;
  overflow: hidden;
  list-style-position: inside;
}