Html div列有问题吗

我想要3列宽度相同的

我确实成功地使用了divs。 我在一个div中做了两个div，然后在其中一个div中做了另一个div，然后使用css float left和right

但是我想知道是否有一种不同的更好的方法？（没有桌子，我试着在没有桌子的情况下这样做） 因为我无法将图像旁边的文本居中

因为我使用了float，白色背景消失在列所在的区域

有人能帮我解决我遇到的问题，或者给我一个替代方法。

<div class="wrapper">
    <div class="left"></div>
    <div class="middle"></div>
    <div class="right"></div>
</div>

.wrapper {
    margin: 0 auto;
    width: 450px;
}
.left {
    float: left;
    width: 150px;
    background-color: red;
    height:200px;
    display:inline-block;
}
.middle {
    background-color: yellow;
    height:200px;
    width: 150px;
    display:inline-block;
}
.right {
    float: right;
    width: 150px;
    background-color: blue;
    height:200px;
    display:inline-block;
}

.包装纸{
保证金：0自动；
宽度：450px；
}
.左{
浮动：左；
宽度：150px；
背景色：红色；
高度：200px；
显示：内联块；
}
.中{
背景颜色：黄色；
高度：200px；
宽度：150px；
显示：内联块；
}
.对{
浮动：对；
宽度：150px；
背景颜色：蓝色；
高度：200px；
显示：内联块；
}

我真的不明白你的问题。但我有一个解决办法。下面是我在小提琴上的演示：

HTML:

---

另请参见感谢您的帮助，此方法有效。对不起，如果我把你弄糊涂了，这是我在这里的第一个问题，我还在学习。你能帮我解决另一个问题吗。在这些div列中，我有3个带有价格的链接图片。但价格是在图像下，我希望它们显示在图像旁边，以中间为中心。是否有此标签或是否需要制作更多列div？请将其作为另一个问题发布？谢谢我很乐意帮助你……）@用户3236466查看我为您制作的。我在用桌子，但这不是唯一的方法。获得更多实践，您将发现可以应用的几种方法：）您的方法看起来也不错，只是听听您的意见，创建列、表或div的最佳方法是什么？我的老师告诉我最好使用divs。要制作网站布局，最好使用divs。仅当您希望以列和行显示数据时才使用表。相信我，用表格来做网站布局是很麻烦的。它既不高效也不灵活。

<div id='parent'>
    <div id='first'>First</div>
    <div id='second'>Second</div>
    <div id='third'>Third</div>
</div>

#parent{
    width: 900px;
    margin: 0 auto;
}

#first, #second, #third{
    width: 300px;
    float: left;
    color: white;
    text-align: center;
}

#first{
    background-color: #222;
}

#second{
    background-color: #444;
}

#third{
    background-color: #666;
}