diff --git a/model/ConceptProperty.php b/model/ConceptProperty.php
index 83041e33d..99ff7f6b6 100644
--- a/model/ConceptProperty.php
+++ b/model/ConceptProperty.php
@@ -61,6 +61,14 @@ public function getLabel()
         return null;
     }
 
+    /**
+     * Returns an alphanumeric ID for the property, suitable for use as a CSS identifier.
+     */
+    public function getID()
+    {
+        return preg_replace('/[^A-Za-z0-9-]/', '_', $this->prop);
+    }
+
     /**
      * Returns text for the property tooltip.
      * @return string
diff --git a/resource/js/scripts.js b/resource/js/scripts.js
index 7f5eeac3a..723e422a2 100644
--- a/resource/js/scripts.js
+++ b/resource/js/scripts.js
@@ -433,6 +433,7 @@ function loadMappingProperties(concept, lang, contentLang, $htmlElement, concept
         if (!found) {
           conceptProperty = {
             'type': conceptMappingPropertyValue.type[0],
+            'id': conceptMappingPropertyValue.type[0].replace(/[^A-Za-z-]/g, '_'),
             'label': conceptMappingPropertyValue.typeLabel,
             'notation': conceptMappingPropertyValue.notation,
             'description': conceptMappingPropertyValue.description,
diff --git a/tests/ConceptPropertyTest.php b/tests/ConceptPropertyTest.php
index e2cfbd4f0..fe2ac300b 100644
--- a/tests/ConceptPropertyTest.php
+++ b/tests/ConceptPropertyTest.php
@@ -147,4 +147,23 @@ public function testGetPropertiesSubClassOfHiddenLabel()
     $props = $concept->getProperties();
     $this->assertEquals('skos:hiddenLabel', $props['subclass:prop1']->getSubPropertyOf());
   }
+
+  /**
+   * @covers ConceptProperty::getID
+   */
+  public function testGetIDShortenedURI()
+  {
+    $prop = new ConceptProperty('skosmos:testLabel', 'Test label');
+    $this->assertEquals('skosmos_testLabel', $prop->getID());
+  }
+
+  /**
+   * @covers ConceptProperty::getID
+   */
+  public function testGetIDFullURI()
+  {
+    $prop = new ConceptProperty('http://rdaregistry.info/Elements/a/P50008', 'has hierarchical superior');
+    $this->assertEquals('http___rdaregistry_info_Elements_a_P50008', $prop->getID());
+  }
+
 }
diff --git a/view/concept-shared.twig b/view/concept-shared.twig
index 6b80a87c8..9e2b37d5a 100644
--- a/view/concept-shared.twig
+++ b/view/concept-shared.twig
@@ -39,7 +39,7 @@
         </div>
       {% endif %}
       {% spaceless %}
-      <div class="row{% if concept.type == 'skosext:DeprecatedConcept' %} deprecated{% endif %}">
+      <div class="row{% if concept.type == 'skosext:DeprecatedConcept' %} deprecated{% endif %} property prop-preflabel">
         <div class="property-label property-label-pref">
           <span class="versal">{% set subPrefLabelTranslation = concept.preferredSubpropertyLabelTranslation(request.lang) %}{% if subPrefLabelTranslation %}{{ subPrefLabelTranslation|upper }}{% else %}{{ 'skos:prefLabel'|trans|upper }}{% endif %}</span>
         </div>
@@ -60,7 +60,7 @@
       {% endspaceless %}
       {% for property in concept.properties %} {# loop through ConceptProperty objects #}
         {% if property.getSubPropertyOf != 'skos:hiddenLabel' %}
-        <div class="row{% if property.type == 'dc:isReplacedBy' %} replaced-by{% endif%}">
+        <div class="row{% if property.type == 'dc:isReplacedBy' %} replaced-by{% endif%} property prop-{{property.ID}}">
           <div class="property-label">
             <span class="versal{% if property.type == 'rdf:type' %}-bold{% endif %}{% if property.description %} property-click" title="{{ property.description }}{% endif %}">{{ property.label|upper }}</span>
           </div>
@@ -113,7 +113,7 @@
       {% endfor %}
       {% set foreignLabels = concept.foreignLabels %}
       {% if foreignLabels %}
-      <div class="row">
+      <div class="row property prop-other-languages">
         <div class="property-label"><span class="versal property-click" title="{% trans "foreign prefLabel help" %}" >{{ 'foreign prefLabels'|trans|upper }}</span></div>
         <div class="property-value-column"><div class="property-value-wrapper">
           {% for language,labels in foreignLabels %}
@@ -127,7 +127,7 @@
           </div>
         </div></div>
       {% endif %}
-        <div class="row">
+        <div class="row property prop-uri">
             <div class="property-label"><span class="versal">URI</span></div>
             <div class="property-value-column"><div class="property-value-wrapper"><span class="versal uri-input-box" id="uri-input-box">{{ concept.uri }}</span> <button type="button" data-toggle="tooltip" data-placement="button" title="Copy to clipboard" class="btn btn-default btn-xs copy-clipboard" for="#uri-input-box"><span class="glyphicon glyphicon-copy" aria-hidden="true"></span></button></div></div>
         </div>
@@ -166,7 +166,7 @@
 {% verbatim %}
 <template id="property-mappings-template">
     {{#each properties}}
-    <div class="row{{#ifDeprecated concept.type 'skosext:DeprecatedConcept'}} deprecated{{/ifDeprecated}}">
+    <div class="row{{#ifDeprecated concept.type 'skosext:DeprecatedConcept'}} deprecated{{/ifDeprecated}} property prop-{{ id }}">
         <div class="property-label"><span class="versal{{#ifNotInDescription type description}} property-click" title="{{ description }}{{/ifNotInDescription}}">{{toUpperCase label}}</span></div>
         <div class="property-value-column">
             {{#each values }} {{! loop through ConceptPropertyValue objects }}