如何在右下方显示左div？

Question

我试图得到这个，以便当在900px或更低的时间观看时，右边的div显示在左边的div上方。

这是JS Fiddle

的链接

http://jsfiddle.net/lawrencetimmins/ycxkjya1/

请提前帮助我解决此问题

Answer 1

更改HTML中的顺序，以便右侧DIV位于左侧之前。

<div id="portfolio-right-1"></div>
<div id="portfolio-left-1"></div>

并设置左右浮动：

#portfolio-right-1
{
   float: right;
}

#portfolio-left-1
{ 
  float: left;
}

现在，当屏幕尺寸小于900px且两个div都拉伸到100％时，“右边”会先出现。

Answer 2

首先交换div，然后将右边的那个放在右边。

<div id="portfolio-right-1" class="right-column-portfolio-1"></div>
<div id="portfolio-left-1" class="left-column-portfolio-1"></div>

接下来在CSS中使用媒体选择器来移除浮动。像这样的东西

@media all and (max-width: 900px) {
    .left-column-portfolio-1, .right-column-portfolio-1 { 
        float: none;
        display: block; 
    }
}