diff --git a/webgoat-container/src/main/resources/static/css/quiz.css b/webgoat-container/src/main/resources/static/css/quiz.css
new file mode 100644
index 000000000..0995d4897
--- /dev/null
+++ b/webgoat-container/src/main/resources/static/css/quiz.css
@@ -0,0 +1,19 @@
+#q_container .quiz_question {
+ border: solid 1px;
+ padding: 4px;
+ margin: 5px 2px 5px 2px;
+}
+
+#q_container .quiz_question label {
+ font-weight: normal;
+}
+
+#q_container .quiz_question.correct {
+ border: solid 3px green;
+ background: #b0dcb0;
+}
+
+#q_container .quiz_question.incorrect {
+ border: solid 3px red;
+ background: #e8b6b6;
+}
\ No newline at end of file
diff --git a/webgoat-container/src/main/resources/static/js/quiz.js b/webgoat-container/src/main/resources/static/js/quiz.js
index e1f844063..69a257c7f 100644
--- a/webgoat-container/src/main/resources/static/js/quiz.js
+++ b/webgoat-container/src/main/resources/static/js/quiz.js
@@ -4,7 +4,8 @@ Basic steps for implementing a quiz:
1. HTML: include this js script file for the assignment, build a basic form, where you include a #q_container div element, create a submit button with "Quiz_solutions" as name attribute
2. JSON: Create a JSON-file with the name questions_lesson_name.json, include a span element #quiz_id with lesson_name as the data-quiz_id attribute. Build a JSON file like the one in sql-injection -> resources -> js
3. Java: Create a normal assignment that has a String[] where the correct solutions are contained in the form of "Solution [i]", replace [i] with the position of the solution beginning at 1.
- The request parameters will contain the answer in full text with "Solution [i]" in front of the text. Use them to check the answers validity.
+ The request parameters will contain the answer in full text with "Solution [i]" in front of the text. Use them to check the answers validity.
+4. CSS: include the css/quiz.css file for styling.
**/
$(function () {
@@ -21,11 +22,11 @@ $(function () {
let html = "";
jQuery.each(questionsObj, function(i, obj) {
jQuery.each(obj, function(j, quest) {
- html += "