diff --git a/main.js b/main.js
index 7ebf3216c550fe6596161f6408be177e145d10d2..b88172d7e03d78cc42cf5056cf02a96b95eb2e9e 100644
--- a/main.js
+++ b/main.js
@@ -113,10 +113,10 @@ function initUi() {
 		$('#loopList').text('');
 		for (let i = 0; i < result.records.loop.length; i++) {
 			if (result.records.loop[i].length > 0) {
-				$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td>' + result.records.loop[i][result.records.loop[i].length - 1].time + 'ms</td><td>' + result.records.loop[i].length + '</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><a>note:<span contenteditable style="min-width:20px;display: inline-block;"></span></a><button id="loopPlay" value="' + i + '">' + (result.records.info[i].isLoop ? pauseIcon : playIcon) + '</button><a>note:<span contenteditable style="min-width:20px;display: inline-block;"></span></a></td><td><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
+				$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td>' + result.records.loop[i][result.records.loop[i].length - 1].time + 'ms</td><td>' + result.records.loop[i].length + '</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><a>note:<span contenteditable class="spanEditable"></span></a><button id="loopPlay" value="' + i + '">' + (result.records.info[i].isLoop ? pauseIcon : playIcon) + '</button><a>note:<span contenteditable class="spanEditable"></span></a></td><td><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
 			}
 			else {
-				$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td></td><td>0</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><a>note:<span contenteditable style="min-width:20px;display: inline-block;"></span></a><button id="loopPlay" value="' + i + '">' + playIcon + '</button><a>note:<span contenteditable style="min-width:20px;display: inline-block;"></span></a></td><td><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
+				$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td></td><td>0</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><a>note:<span contenteditable class="spanEditable"></span></a><button id="loopPlay" value="' + i + '">' + playIcon + '</button><a>note:<span contenteditable class="spanEditable"></span></a></td><td><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
 			}
 		}
 	});
diff --git a/style.css b/style.css
index 925493b1905cbef796813f4ba7477d715ef9da5e..faac5a2a06cb41c272d2feb16532907c549b44bd 100644
--- a/style.css
+++ b/style.css
@@ -239,6 +239,15 @@ a[title]:hover {
   display: none;
 }
 
-td span, td svg, td label {
+td span,
+td svg,
+td label {
   vertical-align: middle;
-}
\ No newline at end of file
+}
+
+.spanEditable {
+  min-width: 20px;
+  display: inline-block;
+  padding-left: 2px;
+  padding-bottom: 2px;
+}