将两个子弹列表左/右放在同一个div中出了点问题

Question

在this页面的顶部，我在同一个版块中有两个名为“Artykułoymnie w mediach”和“Moje publikacje”的子弹列表。

“Artykułyomnie w mediach”在左边显示。 “Moje publikacje”出现在右边。

我添加了一个指向左侧网址的新链接，然后我将.mediaomnielistright ul和.mediaomnielistleft的大小增加了20倍，然后它被中断了。现在，不是在另一个旁边显示一个列表，而是在顶部和底部显示一个列表。

我试图恢复我所做的所有更改，但出于某种原因，它仍然显示错误。

这是现在正在使用的CSS：

#col2{width:580px; height: auto;}
.mediaomnielistright ul{margin-left:5px; list-style-type: circle; padding-left:20px;}
.mediaomnielistleft ul{list-style-type: circle; padding-left:20px;}
.mediaomnielist {overflow:auto; height:580px;}
.mediaomnielistleft {width:310px; float:left; height:inherit;}
.mediaomnielistright {width:288px; border-left-width:2px; border-style:dashed; border-color:#999; overflow: auto; height:inherit;
}

有人知道什么是错的吗？

Answer 1

580px小于310px + 288px，因此您没有空间容纳这些列。

Answer 2

你增加了左边的宽度？这意味着父<div>中没有足够的空间让它们并排显示。不使用绝对值，而是使用百分比：

mediaomnielistleft, mediaomnielistright { width:49%; }

它不会加起来100％，因为您在父div的右侧有一个滚动条。这大约需要16px。

或者你可以坚持使用实际宽度并改变

mediaomnielistright { width: 251px; }

Answer 3

 .mediaonilist { width :580 px}
 .mediomnielistleft { width : 310 px}
 .mediomnielistleft { width : 290 px}

310 + 290 = 600 所以浮点数被忽略了。我不算边距和填充。