Can we reorder elements when they are present inside different parents? [duplicate]

Answer 1

Instead of flexbox, I did it with table tag

See if it suits you.

.flex-item1 {
  background: skyblue;
  width;
  150px;
  height: 100px;
}

.flex-item2 {
  width: 150px;
  height: 100px;
  background: green
}

.flex-item3 {
  width: 300px;
  height: 400px;
  background: red;
}

@media only screen and (max-width: 600px) {
  table {
    width: 100%;
  }
  .flex-item1,
  .flex-item2,
  .flex-item3 {
    display: block;
    width: 100%;
  }
}

  

    

      

        

          
1
          
3
        
        

          
2