ajuste no css

zzmarques · Oct 6, 2024 · 69cc8bd · 69cc8bd
1 parent 64c0aa6
commit 69cc8bd
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 19 deletions.
diff --git a/index.html b/index.html
@@ -82,7 +82,6 @@ <h1>Habilidades</h1>
         <h1>Projetos</h1>
         <div class="linha-h1"></div>
         <div class="card-projt">
-
             <div class="cards">
                 <img src="src/assets/imagens/space.png" alt="Imagem do Projeto">
                 <div class="info-card">

diff --git a/src/css/responsivo.css b/src/css/responsivo.css
@@ -127,9 +127,9 @@
     }
 
     .card-projt {
-        grid-template-columns: auto auto;
+        flex-flow: row wrap;
+        gap: 0;
         width: 450px;
-        row-gap: 10px;
     }
 
 
@@ -144,20 +144,20 @@
 
     .info-card i {
         font-size: 1.1em;
-
-      }
+    }
 
     .projt img {
         width: 210px;
     }
 
-    #meu-id9 {
-        display: none;
+    .cont {
+        height: auto;
     }
 
     .cont-info {
-        flex-wrap: wrap;
-
+        flex-flow: row wrap;
+        row-gap: 40px;
+        margin: 50px 0;
     }
 
     .card-cont {
@@ -226,6 +226,16 @@
        width: 300px;
     }
 
+    .hab {
+        height: 100%;
+        margin: 80px 0;
+    }
+
+
+    .hab-info {
+        gap: 0px;
+    }
+
     .hab p {
         width: 350px;
     }

diff --git a/src/css/style.css b/src/css/style.css
@@ -212,14 +212,16 @@ h2 {
 .hab-info {
   display: flex;
   height: 100%;
-  align-items: self-start;
+  align-items: flex-start;
+  gap: 20px;
   margin-top: 70px;
 }
 
 .hab p {
   color: rgba(255, 255, 255, 0.685);
   text-align: justify;
   width: 485px;
+  margin-top: 14px;
 }
 
 .hab i {
@@ -254,24 +256,21 @@ h2 {
   display: flex;
   flex-direction: column;
   align-items: center;
-  height: 100vh;
-
+  height: auto;
 }
 
 .projt h1 {
   margin-top: 0px;
 }
 
 .card-projt {
-  display: grid;
-  grid-template-columns: auto auto auto;
-  grid-template-rows: auto auto auto;
-  justify-content: space-around;
-  row-gap: 60px;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  gap: 55px;
   height: 100%;
   width: 92%;
-  margin-top: 10px;
-
+  margin-top: 40px;
 }
 
 .info-card {