thiscodeWorks - Organizing the best of code online

List view

.expanding-div {
    width: 200px;
    overflow: hidden;
    max-height: 0; /* Initial max height */
    transition: max-height 0.5s ease; /* Animation transition property */
    border: 1px solid #ccc;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.expanding-div:hover {
    max-height: 500px; /* Adjust the max height as needed */
}

#js #adaptive #height

Consider mobile native browser's tools and set the full height equal to available space.

<script>
  const fullScreenHeightDiv = $(".fullScreenHeightDiv");
  
  fullScreenHeightDiv.css("height", window.innerHeight);
</script>

Expanding Div with height

Consider mobile native browser's tools and set the full height equal to available space.

Save snippets that work with our extensions