User:Jason.nlw/testtemplate: Difference between revisions

no edit summary
No edit summary
No edit summary
 
Line 1: Line 1:
<style>
  /* CSS to control the layout of elements on larger screens */
  @media (min-width: 768px) {
    .element-container {
      display: flex;
      flex-wrap: wrap;
    }
    .colored-box {
      flex: 1 1 calc(50% - 10px); /* Adjust the width and spacing as needed */
      margin-right: 10px; /* Spacing between elements */
    }
    .colored-box:last-child {
      margin-right: 0;
    }
  }
  /* CSS to control the layout of elements on smaller screens */
  @media (max-width: 767px) {
    .colored-box {
      flex: 1 1 100%;
      margin-right: 0;
      margin-bottom: 10px; /* Spacing between elements */
    }
  }
</style>


<div class="element-container">
<div class="element-container">