fix: Positioning for mobile elements

This commit is contained in:
Sayantan Santra 2024-09-19 17:24:30 -05:00
parent 6bd33b1add
commit b33233e8e3
Signed by: SinTan1729
GPG Key ID: 0538DD402EA50898
2 changed files with 13 additions and 8 deletions

View File

@ -37,18 +37,23 @@
<div class="container"> <div class="container">
<div class="header"> <div class="header">
<img src="https://www.gravatar.com/avatar/a5114f8f2ab803638d442ab3cb39d329?s=200" alt="gravatar" /> <img src="https://www.gravatar.com/avatar/a5114f8f2ab803638d442ab3cb39d329?s=200" alt="gravatar" />
<h2 class="pc-name">Sayantan Santra | সায়ন্তন সাঁতরা | <h2 class="pc name">Sayantan Santra | সায়ন্তন সাঁতরা |
<a href=https://en.wikipedia.org/wiki/Bengali_phonology>IPA</a>: /ʃɑ.e̯ɔn.t̪ɔn ʃãt.ra/ <a href=https://en.wikipedia.org/wiki/Bengali_phonology>IPA</a>: /ʃɑ.e̯ɔn.t̪ɔn ʃãt.ra/
</h2> </h2>
<h3 class="mobile-name">Sayantan Santra<br />সায়ন্তন সাঁতরা<br /><a <h3 class="mobile name">Sayantan Santra<br />সায়ন্তন সাঁতরা<br /><a
href=https://en.wikipedia.org/wiki/Bengali_phonology>IPA</a>: /ʃɑ.e̯ɔn.t̪ɔn ʃãt.ra/</h3> href=https://en.wikipedia.org/wiki/Bengali_phonology>IPA</a>: /ʃɑ.e̯ɔn.t̪ɔn ʃãt.ra/</h3>
</div> </div>
<div class="row"> <div class="row">
<div class="column">Office: PHSC 910</div> <div class="column">Office: PHSC 910</div>
<div class="column" name="mail"> <div class="column pc mail">
Email: <a href="mailto:sayantan.santra@ou.edu">sayantan.santra@ou.edu</a> Email: <a href="mailto:sayantan.santra@ou.edu">sayantan.santra@ou.edu</a>
(PGP key: <a href=https://keys.openpgp.org/vks/v1/by-fingerprint/B7772D9CDFAE54AE8536A390A3319D1C521C0719>A3319D1C521C0719</a>) (PGP key: <a href=https://keys.openpgp.org/vks/v1/by-fingerprint/B7772D9CDFAE54AE8536A390A3319D1C521C0719>A3319D1C521C0719</a>)
</div> </div>
<div class="column mobile mail">
Email: <a href="mailto:sayantan.santra@ou.edu">sayantan.santra@ou.edu</a>
<br />
(PGP key: <a href=https://keys.openpgp.org/vks/v1/by-fingerprint/B7772D9CDFAE54AE8536A390A3319D1C521C0719>A3319D1C521C0719</a>)
</div>
</div> </div>
<hr /> <hr />

View File

@ -37,11 +37,11 @@ img {
flex: 50%; flex: 50%;
} }
.column[name="mail"] { .column.mail {
text-align: right; text-align: right;
} }
.mobile-name { .mobile {
display: none; display: none;
} }
@ -51,7 +51,7 @@ img {
display: block; display: block;
} }
.column[name="mail"] { .column.mail {
text-align: left; text-align: left;
} }
@ -59,11 +59,11 @@ img {
text-align: left; text-align: left;
} }
.pc-name { .pc {
display: none; display: none;
} }
.mobile-name { .mobile {
display: block; display: block;
} }
} }