-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathrant.html
37 lines (36 loc) · 3.91 KB
/
rant.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html lang="en">
<head>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<link href="styles.css" rel="stylesheet">
<title>My Webpage</title>
</head>
<body>
<div class=header style="background-color: #101010;">
<h1>bruh</h1>
</div>
<a href="index.html">Home</a><br><br>
<p>
At first I really didn't care for this assignment. It was a fine idea yeah but I didn't have any idea what I actually wanted to do for it and was having a lot of trouble getting started. I frankly just wanted to wrap it up and move on. But as I worked I started to get more into it, having a bit of fun and coming up with ideas to make things nicer. It was cool! But there does come a point where you get tired of something. And for me that point was the best goddamn picture of a cat I've ever taken absolutely refusing to fit itself under any circumstances.
</p>
<p>
I guess technically, it wasn't just that picture but any of the pictures. It started out innocently enough, I threw together a sloppy flexbox grid to display the cat pics, did a bit of stuff to get it looking nice, encountered a jank issue I couldn't solve and after a while of trying just slapped an ugly bandaid solution on it and called it a day, then moved on to the next page. I'd planned to use the grid again, but something I wanted to have this time was captions under the images, and according to my duck friend that would involve enclosing the images in "figures", so I went for that.
</p>
<p>
But I found the figures didn't work properly with the method of scaling I'd used for the grid and images. Further, that ugly bandage fix I'd done was causing issues here now. I started by just making a new grid class, because, I mean whatever, just wanna get it done, but eventually I decided to go back and un-spaghettify my code. While I was add it I could add captions to the first page, cool. I got to work and it was honestly looking nice, I was feeling pretty happy!
</p>
<p>
But then I ran into a weird issue; one of the cat pictures, which was a slightly different aspect ratio than the others, was displaying as shorter than the others. This would be normal of course, but I'd set object-fit: cover, so it was supposed to be cropped to match. It had been working fine before, why not now? I must have just missed something, so I got to troubleshooting.
</p>
<p>
I'm not gonna pretend I've been here for weeks trying to fix this, but the few hours I have been on it have felt like far longer than were ever warranted. Regardless, I've come to find the images in the new arrangement refuse to respond to any kind of relative vertical scaling at all, and I have no idea why. I've spoken extensively with the duck about it, tried asking others (no responses but I did <i>try</i>), gone over my code a bajillion times. It just doesn't work; to spite me, I suppose. The funny thing is that's actually how I'd originally intended to have the image, but I found the cover arrangement was nicer. But I can't be bothered anymore. I've done my 90% of the time on the 10% of the problems, I'm done. Samuel can stay slightly shorter than the others, I don't care. I never want to look at anything web-related again.
</p>
<p>
At least now I can <i>finally</i> move on to the next week and leave all this webpage stuff behind.
</p>
<footer><hr>
shoutouts to simpleflips
</footer>
</body>
</html>