Merge pull request #3 from oxi1224/main

Fix alignment of languages you cant program
ty oxi <3

2 files changed, 70 insertions, 46 deletions

diff --git a/index.html b/index.html
index 14c75b0..84bf733 100644
--- a/index.html
+++ b/index.html
@@ -40,51 +40,68 @@
     />
     <h2 class="mebeinguseless">a picture of me being useless</h2>
     <h1 class="data">i <u>CANNOT</u> program:</h1>
-    <img
-      class="javaimg"
-      src="https://cdn.discordapp.com/attachments/917977729322872853/973143267677978634/clang.png"
-      alt=""
-    />
-    <span class="notjava">its 2022, at least use c++</span>
-    <img
-      class="javaimg"
-      src="https://cdn.discordapp.com/attachments/832652653292027904/973146727689379860/clang.png"
-      alt=""
-    />
-    <span class="notjava">its 2022, at least use java</span>
-    <br />
-    <img
-      class="javaimg"
-      src="https://cdn.discordapp.com/attachments/917977729322872853/967023902939283456/go.png"
-      alt=""
-    />
-    <span class="notjava">you should<b class="go"> go </b>get some bitches</span>
-    <img
-      class="javaimg"
-      src="https://cdn.discordapp.com/attachments/917977729322872853/967023935713607751/R.png"
-      alt=""
-    />
-    <span class="notjava">this is not centered and idk how to fix it</span>
-    <br />
-    <img
-      class="javaimg"
-      src="https://cdn.discordapp.com/attachments/917977729322872853/967009849680486410/ruby.png"
-      alt=""
-    />
-    <span class="notjava">who the fuck unironically uses ruby?</span>
-    <img
-      class="rustimg"
-      src="https://cdn.discordapp.com/attachments/917977729322872853/967024017812897883/rust.png"
-      alt=""
-    />
-    <span class="notjava">:sOmEOneSAIdRUst: shut the fuck up ÅĠěŜŋżųŹ¢¶Ěá</span>
-    <br />
-    <img
-      class="javaimg"
-      src="https://cdn.discordapp.com/attachments/918571703137894421/999223367750127616/Unofficial_JavaScript_logo_2.svg.png"
-      alt=""
-    />
-    <span class="notjava">([][[]]+[])[+!+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]</span>
+
+    <div class="languages-wrapper">
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/973143267677978634/clang.png"
+          alt=""
+        />
+        <span class="notjava">its 2022, at least use c++</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/832652653292027904/973146727689379860/clang.png"
+          alt=""
+          style="margin-left: 0;"
+        />
+        <span class="notjava">its 2022, at least use java</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967023902939283456/go.png"
+          alt=""
+        />
+        <span class="notjava">you should<b class="go"> go </b>get some bitches</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967023935713607751/R.png"
+          alt=""
+        />
+        <span class="notjava">this is not centered and idk how to fix it</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967009849680486410/ruby.png"
+          alt=""
+        />
+        <span class="notjava">who the fuck unironically uses ruby?</span>
+      </div>
+      <div>
+        <img
+          class="rustimg"
+          src="https://cdn.discordapp.com/attachments/917977729322872853/967024017812897883/rust.png"
+          alt=""
+          style="margin-left: 0;"
+        />
+        <span class="notjava">:sOmEOneSAIdRUst: shut the fuck up ÅĠěŜŋżųŹ¢¶Ěá</span>
+      </div>
+      <div>
+        <img
+          class="javaimg"
+          src="https://cdn.discordapp.com/attachments/918571703137894421/999223367750127616/Unofficial_JavaScript_logo_2.svg.png"
+          alt=""
+        />
+        <span class="notjava">([][[]]+[])[+!+[]]+(!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]</span>
+      </div>
+    </div>
+
     <div id="about"></div>
     <br />
     <h1 class="data" id="ticd">i <u>CANNOT</u> be:</h1>
diff --git a/styles.css b/styles.css
index 9744380..0cde154 100644
--- a/styles.css
+++ b/styles.css
@@ -31,7 +31,7 @@ html, body{
 }
 
 .javaimg{
-    margin-left: 10%;
+    margin-left: 20%;
     width: 50px;
     height: 50px;
     vertical-align: middle;
@@ -274,3 +274,10 @@ html{
   font-weight: 9000;
   font-size: 120%;
 }
+
+
+.languages-wrapper{
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  grid-template-rows: repeat(3, 1fr);
+}