diff --git a/src/components/DefElement.vue b/src/components/DefElement.vue
index 2e7ad3294d7b881fd0267e317fff7e9473c523cc..0ff875bd50b0876f76aea95b159b2b206e95bea1 100644
--- a/src/components/DefElement.vue
+++ b/src/components/DefElement.vue
@@ -8,6 +8,9 @@
        --><router-link v-if="item.type == 'article_ref'" :to="item.ref" @click.native="article_link_click(item)"><!--
          -->{{item.link_text}} {{item.definition_order ? ` (${item.definition_order})` : ''}}<!--
        --></router-link><!--
+       --><span class="numerator" v-if="item.type == 'fraction'">{{item.num}}</span><!--
+       -->{{item.type == 'fraction' ? '⁄' : ''}}<!--
+       --><span class="denominator" v-if="item.type == 'fraction'">{{item.denom}}</span><!--
  --></span></li>
 </template>
 
@@ -50,6 +53,7 @@ export default {
           else if (item.type_ == 'superscript') return {type: item.type_, html: item.text, tag: 'sup'}
           else if (item.type_ == 'subscript') return {type: item.type_, html: item.text, 'tag': 'sub'}
           else if (item.type_ == 'quote_inset') return {type: item.type_, body: item, html: '', tag: 'DefElement', props: {body: item, tag: 'i'}}
+          else if (item.type_ == 'fraction') return {type: item.type_, html: '', num: item.numerator, denom: item.denominator}
           else if (item.id) return {type: item.type_, html: (entities[lang][item.id] || {})['expansion'] || item.id}
           else return {type: item.type_ || 'plain', html: item}
         }
@@ -83,6 +87,17 @@ export default {
   font-style: italic;
 }
 
+.numerator{
+  vertical-align: super;
+  padding-right: 2px;
+}
+
+.denominator {
+  vertical-align: sub;
+  padding-left: 2px;
+}
+
+
 mark {
   background: rgba(255, 255, 255, 0);
 }