在桌子内面漂浮不起作用

Question

我希望将蓝色圆圈向左浮动以获取奇数，向右移动以获得偶数数字。我试过浮动元素，但它似乎不起作用。

我使用table和table-cells来实现居中的文本和徽标，但除非我切换元素的位置，否则似乎无法将它们反转

enter code here

这是一个当前的演示： https://jsfiddle.net/7g7medn1/

结果演示（重新定位dom元素以获得结果，需要在不重新定位的情况下执行此操作）： https://jsfiddle.net/wcttx9vm/

Answer 1

您可能需要为偶数列添加类并更改浮动和显示属性，如下所示：

.even .content {
    display: block; 
}

.even .circle {
    float: right;
}

.even .content {
    display: inline;
}

https://jsfiddle.net/zxhbbwdm/4/

Answer 2

我不明白：当你想要一张桌子时，为什么你不能使用？表可用于显示表内容，但不能用于纯布局。

在你的情况下我会这样做：拿一个php文件并进行＆＃34;布局＆＃34;那里。这意味着你将在for循环中进行奇偶位置并在那里切换奇数布局。我想这将是最简单的方法。

您当前的演示代码无法正常工作，因为您的气泡始终是代码中的第一个。这对于左侧定位是好的，但是对于正确的定位，它需要在文本之后。否则你会搞砸了。