Replace the negative margin hack with flexbox alignment

amatsuda · amatsuda · commit 6e4911a13fa8 · 2025-12-27T04:38:37.000+09:00
This properly centers the gravatar vertically within the nav-link
without causing the element to be displaced, so the active state
background will now display at the same height as other nav items.
diff --git a/app/assets/stylesheets/modules/navbar.css b/app/assets/stylesheets/modules/navbar.css
@@ -1,5 +1,6 @@
 .dropdown-toggle.gravatar-container {
-  margin-bottom: -5px;
+  display: flex;
+  align-items: center;
 }
 
 .navbar-nav {

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,6 @@`
`1`	`1`	`.dropdown-toggle.gravatar-container {`
`2`		`- margin-bottom: -5px;`
	`2`	`+ display: flex;`
	`3`	`+ align-items: center;`
`3`	`4`	`}`
`4`	`5`
`5`	`6`	`.navbar-nav {`