fix algorithm img scaling

MME-NTU-KhPI · Nov 8, 2024 · fd3ecf1 · fd3ecf1
1 parent 3cb5347
commit fd3ecf1
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 7 deletions.
diff --git a/css/algorithms.css b/css/algorithms.css
@@ -6,10 +6,14 @@
     display: flex;
     justify-content: center;
     margin-top: 1rem;
+    margin-left: 3rem;
+    margin-right: 3rem;
+    text-align: center;
 }
 
 .heading{
     font-size: 1.3rem;
+    font-weight: 600;
 }
 
 .infopole{
@@ -20,7 +24,7 @@
 }
 
 .algo-text-container{
-    width: 70%;
+    width: 70vw;
     padding-right: 2rem;
 }
 
@@ -33,12 +37,29 @@
     display: flex;
     justify-content: center;
     align-content: center;
-    width: 30%;
+    flex-wrap: wrap;
+    width: 30vw;
 }
 
 .algo-img{
-    min-width: 80%;
-    max-width: 80%;
-    max-height: auto;
-    min-height: auto;
+width: 25rem;
+height: fit-content;
+}
+@media (max-width: 1198px) {
+    .infopole{
+        flex-direction: column-reverse;
+
+    }
+    .algo-text-container{
+        width: 100%;
+        padding: 0;
+    }
+    .algo-img-container{
+        width: 100%;
+        margin-bottom: 1rem;
+    }
+    .algo-img{
+        width: 100%;
+        height: fit-content;
+    }
 }
diff --git a/html/von_neumann.html b/html/von_neumann.html
@@ -111,12 +111,13 @@
                     </p>
                 </div>
                 <div class="algo-img-container">
-                    <img src="../img/von-Neumann.png">
+                    <img class="algo-img" src="../img/von-Neumann.png">
                 </div>
             </div>
 
         </div>
     </div>
+    <br>
     <footer class="border-top border-dark">
         <div class="left-footer-cont">
             <div class="footer-content ml-5">