diff --git a/resources/assets/stylesheets/scss/courseware.scss b/resources/assets/stylesheets/scss/courseware.scss
index bcde924de3fe2e1b628340de792acc375fc13259..08e8811d604ef525eb66fc13e6e998e1d2f6e1c8 100644
--- a/resources/assets/stylesheets/scss/courseware.scss
+++ b/resources/assets/stylesheets/scss/courseware.scss
@@ -3173,14 +3173,11 @@ c o n f i r m  b l o c k
     .cw-block-confirm-content{
         border: solid thin $content-color-40;
         padding: 1em;
-        display: flex;
-        .cw-block-confirm-checkbox img{
+        margin: 0;
+
+        input[type=checkbox] {
             margin-right: 2em;
-            vertical-align: middle;
-            height: 100%;
-        }
-        .cw-block-confirm-text {
-            margin: 0;
+            vertical-align: bottom;
         }
     }
 }
diff --git a/resources/vue/components/courseware/CoursewareConfirmBlock.vue b/resources/vue/components/courseware/CoursewareConfirmBlock.vue
index d3d04dd00767981dfa9488ffa512bebd80101ce0..58dbc685025c06c52797add734f37458af945a1b 100644
--- a/resources/vue/components/courseware/CoursewareConfirmBlock.vue
+++ b/resources/vue/components/courseware/CoursewareConfirmBlock.vue
@@ -14,15 +14,12 @@
                 <div class="cw-block-title">
                     {{ $gettext('Bestätigung') }}
                 </div>
-                <div class="cw-block-confirm-content">
-                    <div class="cw-block-confirm-checkbox">
-                        <studip-icon v-if="!confirm" shape="checkbox-unchecked" role="info" @click="setConfirm" />
-                        <studip-icon v-if="confirm" shape="checkbox-checked" role="info" />
-                    </div>
-                    <p class="cw-block-confirm-text">
-                        {{ currentText }}
-                    </p>
-                </div>
+                <form class="default cw-block-confirm-content" prevent.default="">
+                    <label>
+                        <input type="checkbox" :disabled="confirm" :checked="confirm" @click="setConfirm"/>
+                        <span>{{ currentText }}</span>
+                    </label>
+                </form>
             </template>
             <template v-if="canEdit" #edit>
                 <form class="default" @submit.prevent="">
@@ -41,14 +38,12 @@
 import CoursewareDefaultBlock from './CoursewareDefaultBlock.vue';
 import { mapActions, mapGetters } from 'vuex';
 import { blockMixin } from './block-mixin.js';
-import StudipIcon from '../StudipIcon.vue';
 
 export default {
     name: 'courseware-confirm-block',
     mixins: [blockMixin],
     components: {
-        CoursewareDefaultBlock,
-        StudipIcon,
+        CoursewareDefaultBlock
     },
     props: {
         block: Object,
@@ -88,6 +83,9 @@ export default {
             }
         },
         async setConfirm() {
+            if (this.confirm) {
+                return;
+            }
             let data = {};
             data.type = 'courseware-user-data-fields';
             data.id = this.block.relationships['user-data-field'].data.id;