Fix css

- Fix sizing for inline status imaged
- Use flexbox for userinfo

1 files changed, 14 insertions, 15 deletions

diff --git a/static/main.css b/static/main.css
index f17a171..0795331 100644
--- a/static/main.css
+++ b/static/main.css
@@ -21,6 +21,15 @@
 	margin: 0px;
 }
 
+.status-content img,
+.status-image,
+.status-video {
+	max-height: 180px;
+	max-width: 220px;
+	width: auto;
+	vertical-align: bottom;
+}
+
 .status-media-container {
 	margin: 4px 0;
 }
@@ -56,6 +65,7 @@
 	height: 20px;
 	margin-bottom: -4px;
 	width: auto;
+	vertical-align: unset !important;
 }
 
 .name-emoji {
@@ -100,14 +110,6 @@
 	color: green;
 }
 
-.status-image,
-.status-video {
-	max-height: 180px;
-	max-width: 220px;
-	width: auto;
-	vertical-align: bottom;
-}
-
 .page-title {
 	font-size: 23pt;
 }
@@ -279,6 +281,7 @@
 .img-link {
 	display: inline-block;
 	position: relative;
+	margin: 2.5px 0;
 }
 
 .status-profile-img-container .img-link {
@@ -346,11 +349,8 @@
 
 .user-info {
 	margin-bottom: 8px;
-}
-
-.user-info-img-container {
-	display: inline-block;
-	vertical-align: top;
+	display: flex;
+	align-items: top;
 }
 
 .user-info-img {
@@ -361,8 +361,7 @@
 }
 
 .user-info-details-container {
-	display: inline-block;
-	vertical-align: middle;
+	margin-left: 8px;
 }
 
 .user-info-details-container>div {