User:Jason.nlw/testtemplate: Difference between revisions

From Semantic Name Authority Repository Cymru
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
<div style="display: flex; flex-wrap: wrap;">
<style>
  <!-- First and Second Elements Container -->
  /* CSS to control the layout of elements on larger screens */
   <div style="flex: 1 1 100%; max-width: 50%;">
  @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="colored-box">
     <!-- First Element -->
     <!-- First Element -->
     {{Colored box
     {{Colored box
Line 14: Line 39:
   </div>
   </div>


  <!-- Third and Fourth Elements Container -->
   <div class="colored-box">
   <div style="flex: 1 1 100%; max-width: 50%;">
     <!-- Second Element -->
     <!-- Third Element -->
     {{Colored box
     {{Colored box
     | background-content-color = #FFC72C
     | background-content-color = #FFC72C
Line 29: Line 53:
   </div>
   </div>


  <!-- Fifth and Sixth Elements Container -->
   <div class="colored-box">
   <div style="flex: 1 1 100%; max-width: 50%;">
     <!-- Third Element -->
     <!-- Fourth Element -->
     {{Colored box
     {{Colored box
     | background-content-color = #FFC72C
     | background-content-color = #FFC72C
Line 41: Line 64:
   </div>
   </div>


  <!-- Seventh and Eighth Elements Container -->
   <div class="colored-box">
   <div style="flex: 1 1 100%; max-width: 50%;">
     <!-- Fourth Element -->
     <!-- Fifth Element -->
     {{Colored box
     {{Colored box
     | background-content-color = #FFC72C
     | background-content-color = #FFC72C

Revision as of 18:08, 22 July 2023

<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>

Place
Any place whether natural or human made
Concept
Semantic unit understood in different ways
Life
Any living physical entity such as an animal, plant, fungus, or bacterium
Creation
Intentional intellectual or artistic creation