play with css

src/events/intro/customizeSlaveTrade/customizeSlaveTrade.css

@@ -5,10 +5,14 @@
     display: inline-block;
 }
 
+.customize-slave-trade-li-container {
+	float: right;
+}
+
 .customize-slave-trade-li {
     text-align: center;
     display: inline-block;
-    padding-bottom: 20px;
+    padding: 2px;
     width: 15em;
 }
 

src/events/intro/customizeSlaveTrade/customizeSlaveTrade.js

@@ -18,6 +18,7 @@ App.UI.CustomSlaveTrade = function() {
 		let div;
 		let array;
 		let list;
+		let span;
 		const nationalitiesCheck = App.UI.nationalitiesCheck();
 
 		if (hashSum(V.nationalities) < 1) {
@@ -115,9 +116,12 @@ App.UI.CustomSlaveTrade = function() {
 				const li = document.createElement("LI");
 				li.classList.add("customize-slave-trade-li");
 				li.append(nation);
+
+				span = document.createElement("span");
+				span.classList.add("customize-slave-trade-li-container");
 				App.UI.DOM.appendNewElement(
 					"span",
-					li,
+					span,
 					App.UI.DOM.link(
 						`+`,
 						() => {
@@ -130,7 +134,7 @@ App.UI.CustomSlaveTrade = function() {
 				if (nationalitiesCheck[nation]) {
 					App.UI.DOM.appendNewElement(
 						"span",
-						li,
+						span,
 						App.UI.DOM.link(
 							`-`,
 							() => {
@@ -147,7 +151,7 @@ App.UI.CustomSlaveTrade = function() {
 				if (V.nationalities[nation] > 1) {
 					App.UI.DOM.appendNewElement(
 						"span",
-						li,
+						span,
 						App.UI.DOM.link(
 							`0`,
 							() => {
@@ -158,6 +162,7 @@ App.UI.CustomSlaveTrade = function() {
 						"zeroButton"
 					);
 				}
+				li.append(span);
 				list.append(li);
 			}
 			p.append(list);
@@ -175,9 +180,11 @@ App.UI.CustomSlaveTrade = function() {
 					li.classList.add("customize-slave-trade-li");
 					li.title = racialNationalities.length > 0 ? racialNationalities.join(", ") : "(none)";
 					li.append(race);
+					span = document.createElement("span");
+					span.classList.add("customize-slave-trade-li-container");
 					App.UI.DOM.appendNewElement(
 						"span",
-						li,
+						span,
 						App.UI.DOM.link(
 							`+`,
 							() => {
@@ -192,7 +199,7 @@ App.UI.CustomSlaveTrade = function() {
 					);
 					App.UI.DOM.appendNewElement(
 						"span",
-						li,
+						span,
 						App.UI.DOM.link(
 							`0`,
 							() => {
@@ -206,6 +213,7 @@ App.UI.CustomSlaveTrade = function() {
 						),
 						"zeroButton"
 					);
+					li.append(span);
 					list.append(li);
 				}
 			}
@@ -218,9 +226,11 @@ App.UI.CustomSlaveTrade = function() {
 				li.classList.add("customize-slave-trade-li");
 				const nation = keys[i];
 				li.append(nation);
+				span = document.createElement("span");
+				span.classList.add("customize-slave-trade-li-container");
 				App.UI.DOM.appendNewElement(
 					"span",
-					li,
+					span,
 					App.UI.DOM.link(
 						`+`,
 						() => {
@@ -234,7 +244,7 @@ App.UI.CustomSlaveTrade = function() {
 				if (nationalitiesCheck[nation]) {
 					App.UI.DOM.appendNewElement(
 						"span",
-						li,
+						span,
 						App.UI.DOM.link(
 							`-`,
 							() => {
@@ -251,7 +261,7 @@ App.UI.CustomSlaveTrade = function() {
 				if (V.nationalities[nation] > 1) {
 					App.UI.DOM.appendNewElement(
 						"span",
-						li,
+						span,
 						App.UI.DOM.link(
 							`0`,
 							() => {
@@ -262,6 +272,7 @@ App.UI.CustomSlaveTrade = function() {
 						"zeroButton"
 					);
 				}
+				li.append(span);
 				list.append(li);
 			}
 		}