Html 使浮动左元素环绕浮动右元素

我有一个无序的列表，列表项在一个div中向左浮动。在这个div中有一个右侧浮动的边栏

在此图像中，您可以看到列表项中的文本到达侧边栏后会自动换行。但是，列表项本身没有，因此您仍然可以看到侧边栏后面的白色背景

如何使列表项也包装起来

#容器{
背景：#f8f8；
边框：1px实心#d1d1；
显示：块；
左边距：自动；
右边距：自动；
最大宽度：1200px；
溢出：隐藏；
填充：10px；
位置：相对位置；
}
#边栏{
背景：无；
浮动：对；
边际：0 10px 0；
填充：10px；
宽度：300px；
过渡：右侧500毫秒；
边框：1px纯灰；
最小高度：300px；
}
.ul{
列表样式类型：无；
}
.李国宝{
保证金：0px 0px 10px 0px；
背景色：#fff；
边框：1px实心#F4；
左边框颜色：rgb（244244244）；
左边框样式：实心；
左边框宽度：1px；
左边框：4px实心#e6；
盒影：0px 1px 2px rgba（0,0,0,0.03）；
边界半径：2px；
填充：10px；
}

边栏


测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试


测试


测试


测试


测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试


测试


测试


测试

添加溢出：自动；到你的ul>李做的把戏

#容器{
背景：#f8f8；
边框：1px实心#d1d1；
显示：块；
左边距：自动；
右边距：自动；
最大宽度：1200px；
溢出：隐藏；
填充：10px；
位置：相对位置；
}
#边栏{
背景：无；
浮动：对；
边际：0 10px 0；
填充：10px；
宽度：300px；
过渡：右侧500毫秒；
边框：1px纯灰；
最小高度：300px；
}
.ul{
列表样式类型：无；
}
.李国宝{
保证金：0px 0px 10px 0px；
背景色：#fff；
边框：1px实心#F4；
左边框颜色：rgb（244244244）；
左边框样式：实心；
左边框宽度：1px；
左边框：4px实心#e6；
盒影：0px 1px 2px rgba（0,0,0,0.03）；
边界半径：2px；
填充：10px；
溢出：自动；
}

边栏


测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试


测试


测试


测试


测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试


测试


测试


测试