MediaWiki:Common.css: Difference between revisions

Latest revision as of 08:07, 27 September 2023

/* Default styles for larger screens */
.page-container {
  display: flex;
  align-items: flex-start; /* Align items to the top */
}

.infobox-container {
  width: 30%; /* Adjust the width as needed */
  float: left; /* Float the infobox-container to the left */
}

.infobox-wrapper {
  width: 100%; /* Ensure the wrapper takes up the full width */
  order: 2; /* Set the order to display the infobox below the image */
}

.infoboximg {
  width: 90%; /* Ensure the image takes up the full width of .infoboximg */
  order: 1; /* Set the order to display the image above the infobox */
}

.infobox {
  width: 90%; /* Ensure the infobox takes up the full width */
}

.content {
  width: 100%; /* Adjust the width as needed */
  padding-left: 5%;
}

/* Media query for smaller screens (tablets) */
@media (max-width: 1024px) {
  .page-container {
    flex-direction: column; /* Stack elements vertically on smaller screens */
    align-items: center; /* Center align content */
  }

  .infobox-container, .content {
    width: 100%; /* Allow each element to take up the full width */
    margin: 0; /* Remove any margins on smaller screens */
  }
}

/* Media query for mobile devices */
@media (max-width: 768px) {
  .page-container {
    align-items: flex-start; /* Align items to the top */
  }
}