diff --git a/src/components/cards/CardItem.vue b/src/components/cards/CardItem.vue
index 70a85a0ce..56d7613e3 100644
--- a/src/components/cards/CardItem.vue
+++ b/src/components/cards/CardItem.vue
@@ -30,23 +30,21 @@
 		<div class="card-upper">
 			<h3 v-if="showArchived">{{ card.title }}</h3>
 			<h3 v-else-if="!editing" @click.stop="startEditing(card)">{{ card.title }}</h3>
-			<h3 v-else>editing</h3>
-			<transition name="fade" mode="out-in">
-				<form v-click-outside="cancelEdit" v-if="editing" @keyup.esc="cancelEdit"
-					@submit.prevent="finishedEdit(card)">
-					<input v-model="copiedCard.title" type="text" autofocus>
-					<input type="button" class="icon-confirm" @click="finishedEdit(card)">
-				</form>
+			<h3 v-else>&nbsp;</h3>
+			<form v-click-outside="cancelEdit" v-if="editing" @keyup.esc="cancelEdit"
+				@submit.prevent="finishedEdit(card)">
+				<input v-model="copiedCard.title" type="text" autofocus>
+				<input type="button" class="icon-confirm" @click="finishedEdit(card)">
+			</form>
 
-				<Actions @click.stop.prevent>
-					<ActionButton v-if="showArchived === false" icon="icon-user" @click="assignCardToMe()">{{ t('deck', 'Assign to me') }}</ActionButton>
-					<ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">{{ t('deck', (showArchived ? 'Unarchive card' : 'Archive card')) }}</ActionButton>
-					<ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">{{ t('deck', 'Delete card') }}</ActionButton>
-					<ActionButton icon="icon-external" @click.stop="modalShow=true">{{ t('deck', 'Move card') }}</ActionButton>
-					<ActionButton icon="icon-settings-dark" @click="openCard">{{ t('deck', 'Card details') }}</ActionButton>
-				</Actions>
+			<Actions v-if="!editing" @click.stop.prevent>
+				<ActionButton v-if="showArchived === false" icon="icon-user" @click="assignCardToMe()">{{ t('deck', 'Assign to me') }}</ActionButton>
+				<ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">{{ t('deck', (showArchived ? 'Unarchive card' : 'Archive card')) }}</ActionButton>
+				<ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">{{ t('deck', 'Delete card') }}</ActionButton>
+				<ActionButton icon="icon-external" @click.stop="modalShow=true">{{ t('deck', 'Move card') }}</ActionButton>
+				<ActionButton icon="icon-settings-dark" @click="openCard">{{ t('deck', 'Card details') }}</ActionButton>
+			</Actions>
 
-			</transition>
 			<modal v-if="modalShow" title="Move card to another board" @close="modalShow=false">
 				<div class="modal__content">
 					<Multiselect :placeholder="t('deck', 'Select a board')" v-model="selectedBoard" :options="boards"
@@ -60,7 +58,6 @@
 
 				</div>
 			</modal>
-
 		</div>
 		<ul class="labels" @click="openCard">
 			<li v-for="label in card.labels" :key="label.id" :style="labelStyle(label)"><span>{{ label.title }}</span></li>
@@ -225,7 +222,7 @@ export default {
 				display: flex;
 				padding: 5px 7px;
 				position: absolute;
-				width: calc(100% - 14px);
+				width: 100%;
 				input[type=text] {
 					flex-grow: 1;
 				}
@@ -236,6 +233,8 @@ export default {
 				flex-grow: 1;
 				font-size: 100%;
 				cursor: text;
+				overflow-x: hidden;
+				word-wrap: break-word;
 			}
 		}