diff --git a/source/components/rule/Rule.css b/source/components/rule/Rule.css
index 9b4bf113b..c016bb3eb 100644
--- a/source/components/rule/Rule.css
+++ b/source/components/rule/Rule.css
@@ -123,66 +123,3 @@
 	margin: 3em auto 0;
 	display: block;
 }
-
-
-
-/* mécanisme somme */
-.somme table {
-	width: 100%;
-	border-collapse: collapse;
-}
-.somme td.blank {
-	background: white;
-	border: 1px solid white;
-	border-right: 1px solid rgba(51, 51, 80, 0.15);
-}
-.somme tr {
-	border: 1px solid rgba(51, 51, 80, 0.15);
-}
-.somme tr:hover {
-	background: rgba(51, 51, 80, 0.02)
-}
-.somme tr:nth-child(2n) {
-
-}
-.somme tr .element {
-	text-align: left;
-	padding: .1em .6em;
-}
-.somme tr .value span {
-	text-align: right;
-}
-.somme .leaf .name {
-	border: none;
-}
-.somme .operator {
-	text-align: center;
-	width: 1em;
-	padding: 0 .4em;
-	font-weight: 600;
-	font-size: 120%;
-	color: black;
-}
-#rule-rules .somme table .leaf .situationValue {
-	display: none;
-}
-
-#rule-rules .somme table .situationValue {
-	padding: 0 1em;
-}
-#rule-rules .somme table .situationValue span {
-}
-
-.somme .nested {
-  padding: 0;
-	border: none;
-}
-.somme .nested tr:first-child {
-	border-top: none;
-}
-.somme .noNest {
-	border-bottom: none;
-}
-.somme > table  {
-	border-bottom: 1px solid rgba(51, 51, 80, 0.15);
-}
diff --git a/source/engine/mecanismViews/Somme.css b/source/engine/mecanismViews/Somme.css
new file mode 100644
index 000000000..2b4d17c3d
--- /dev/null
+++ b/source/engine/mecanismViews/Somme.css
@@ -0,0 +1,61 @@
+
+/* mécanisme somme */
+.somme table {
+	width: 100%;
+	border-collapse: collapse;
+}
+.somme td.blank {
+	background: white;
+	border: 1px solid white;
+	border-right: 1px solid rgba(51, 51, 80, 0.15);
+}
+.somme tr {
+	border: 1px solid rgba(51, 51, 80, 0.15);
+}
+.somme tr:hover {
+	background: rgba(51, 51, 80, 0.02)
+}
+.somme tr:nth-child(2n) {
+
+}
+.somme tr .element {
+	text-align: left;
+	padding: .1em .6em;
+}
+.somme tr .value span {
+	text-align: right;
+}
+.somme .leaf .name {
+	border: none;
+}
+.somme .operator {
+	text-align: center;
+	width: 1em;
+	padding: 0 .4em;
+	font-weight: 600;
+	font-size: 120%;
+	color: black;
+}
+#rule-rules .somme table .leaf .situationValue {
+	display: none;
+}
+
+#rule-rules .somme table .situationValue {
+	padding: 0 1em;
+}
+#rule-rules .somme table .situationValue span {
+}
+
+.somme .nested {
+  padding: 0;
+	border: none;
+}
+.somme .nested tr:first-child {
+	border-top: none;
+}
+.somme .noNest {
+	border-bottom: none;
+}
+.somme > table  {
+	border-bottom: 1px solid rgba(51, 51, 80, 0.15);
+}
diff --git a/source/engine/mecanismViews/Somme.js b/source/engine/mecanismViews/Somme.js
index 0f4e91b51..5ccd9c53f 100644
--- a/source/engine/mecanismViews/Somme.js
+++ b/source/engine/mecanismViews/Somme.js
@@ -2,6 +2,7 @@ import React, { Component } from "react"
 import { makeJsx } from "../evaluation"
 import { path } from "ramda"
 import { Node, NodeValue } from "./common"
+import './Somme.css'
 
 export default ({ explanation, nodeValue }) => (
 	<Node
@@ -15,7 +16,7 @@ export default ({ explanation, nodeValue }) => (
 let Table = ({ explanation }) => (
 	<table>
 		<caption />
-		<tbody>{explanation.map((v, i) => <Row {...{ v, i }} />)}</tbody>
+		<tbody>{explanation.map((v, i) => <Row key={i} {...{ v, i }} />)}</tbody>
 	</table>
 )
 
@@ -36,14 +37,16 @@ class Row extends Component {
 				onClick={() => this.setState({ folded: false })}
 			>
 				<td className="operator blank">{i != 0 && "+"}</td>
-				<td className="element">{makeJsx(v)}</td>
+				<td className="element">
+					{makeJsx(v)}
+				</td>
 				<td className="situationValue value">
 					<NodeValue data={v.nodeValue} />
 				</td>
 			</tr>,
 			...(isSomme && !this.state.folded
 				? [
-					<tr className="nested">
+					<tr className="nested" key={v.name + "-nest"}>
 						<td className="blank" />
 						<td className="nested">
 							<Table explanation={rowFormula.explanation} />