Css 移动站点上未显示Div表

我希望这里有人能帮助我。我已经用标签为我的网站创建了一个表格，因为用

创建表格的“老派”方式在移动网站上不起作用-所有东西都沿着右手边被切断，没有滑动的选项

我的代码是：

<style>
.list_item1 {
    display: inline-block;
    margin: 5px;
    padding: 1px;
    width: 200px;
}
.list_item2 {
    display: inline-block;
    margin: 5px;
    padding: 1px;
    width: 600px;
}
#wraplist {
    width:800px;
    column-count:2;
    column-gap:10px;
    -moz-column-count:2;
    -moz-column-gap:20px;
    -webkit-column-count:2;
    -webkit-column-gap:20px;
}

</style>

.列出项目1{
显示：内联块；
保证金：5px；
填充：1px；
宽度：200px；
}
.列出项目2{
显示：内联块；
保证金：5px；
填充：1px；
宽度：600px；
}
#包装工{
宽度：800px；
列数：2；
柱间距：10px；
-moz列数：2；
-moz柱间距：20px；
-webkit列数：2；
-webkit柱间隙：20px；
}

使用以下HTML：

<div id="wraplist">
<div class="list_item1"><li>A</li></div>
<div class="list_item1"><li>B</li></div>
<div class="list_item1"><li>C</li></div>
<div class="list_item1"><li>D</li></div>
<div class="list_item1"><li>E</li></div>
<div class="list_item2"><li>F</li></div>
<div class="list_item2"><li>G</li></div>
<div class="list_item2"><li>H</li></div>
<div class="list_item2"><li>I</li></div>
<div class="list_item2"><li>J</li></div>
</div>
<div style='clear:both;'>&nbsp;</div>

A
B
C
D
E
F
G
H
我
J

如果您想知道为什么我使用Div而不是通过CSS控制的

，那是因为无论出于什么原因，它都不起作用。我在我的网站上复制并粘贴了其他被证明有效的代码，它只是显示为一个列表，而不是分成两列的列表。div创建了两个列表，但它们不会显示在移动站点上。结果是“列表项1”显示，然后“列表项2”中的第一行以非常大的字体显示，其他所有内容都消失了

我已经创建了两个“列表项”，因为我需要列更大，以便为第二行中的额外文本腾出空间。我不能让它们大小相等

---

有没有人知道如何解决这个问题，使它显示在移动设备上？或者另一种方法可以？

该结构将无法验证，

li

必须在

ul

范围内好的，我越来越近了。我添加了：@仅媒体屏幕和（最小设备宽度：320px）和（最大设备宽度：480px）{并删除了适用于移动浏览器的代码的填充。现在我的问题是，措辞并不总是与项目符号对齐……我应用了“列表样式位置：inside；”，但它不起作用。哦，抱歉，刚才看到了你的评论Paulie_D。感谢你的回复！我将删除li，看看是否正确对齐。