改变浮动元素的垂直方向

Question

我正在开发一个活动页面的移动版本，该页面将div用于列，并用于格式设置。当桌面布局时，我想替换事件海报的两侧，但现在，当浮动垂直堆叠时，事件海报在事件描述之后结束。我已经在CSS和检查器里面了很久了，现在似乎无法使它工作。我试着把浮点数从左转到右，添加了清除:和清除:左/右，并搅乱了最小、最大宽度和列百分比，但都没有效果。到beta站点上页面的链接在这里：http://oxford.beta.st/events/。

我觉得应该有一个简单的解决办法..。任何想法都很感激。

Answer 1

问题是，我注意到您正在使用.column1和.column2，您正在交替使用一次用于描述，另一次用于海报。因此，它的行为，它应该添加你的“偶数”海报在底部的描述应该是。

这意味着海报标记最终比它应该的要低，在这种情况下，我建议使用CSS :nth-child 伪选择器的另一种方法，以便您的标记保持不变(意思是始终使用.column1作为海报)，但是您可以根据元素使用CSS来样式和浮动。

另一个很好的资源是关于如何使用这个强大的伪选择器的示例，它是在这里发现的。

编辑：

工作jsFiddle

添加了这个小提琴，以显示如何使用第n个孩子在这个特定的问题。请注意我是怎么说的，每一行都是为.column1和.column2做的