diff --git a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html
index abc0e306c..d3e8686b0 100644
--- a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html
+++ b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.html
@@ -35,11 +35,11 @@
         <tr *ngFor="let country of countries">
           <td class="text-left rank">{{ country.rank }}</td>
           <td class="text-left text-truncate name">
-            <div class="d-flex">
-              <span style="font-size: 20px">{{ country.flag }}</span>
+            <a class="d-flex align-items-center" [routerLink]="['/lightning/nodes/country' | relativeUrl, country.iso]">
+              <span class="flag">{{ country.flag }}</span>
               &nbsp;
-              <a class="mt-auto mb-auto" [routerLink]="['/lightning/nodes/country' | relativeUrl, country.iso]">{{ country.name.en }}</a>
-            </div>
+              <span class="link">{{ country.name.en }}</span>
+            </a>
           </td>
           <td class="text-right share">{{ country.share }}%</td>
           <td class="text-right nodes">{{ country.count }}</td>
diff --git a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss
index c2c94cac0..97a3e76f6 100644
--- a/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss
+++ b/frontend/src/app/lightning/nodes-per-country-chart/nodes-per-country-chart.component.scss
@@ -79,3 +79,15 @@
     max-width: 100px;
   }
 }
+
+a {
+  text-decoration: none;
+}
+
+a:hover .link {
+  text-decoration: underline;
+}
+
+.flag {
+  font-size: 20px;
+}