diff --git a/core/modules/field/src/Tests/EntityReference/EntityReferenceFormatterTest.php b/core/modules/field/src/Tests/EntityReference/EntityReferenceFormatterTest.php
index 3c7b9d6..4c9fdfe 100644
--- a/core/modules/field/src/Tests/EntityReference/EntityReferenceFormatterTest.php
+++ b/core/modules/field/src/Tests/EntityReference/EntityReferenceFormatterTest.php
@@ -185,19 +185,18 @@ public function testEntityFormatter() {
     $build = $this->buildRenderArray([$this->referencedEntity, $this->unsavedReferencedEntity], $formatter);
 
     // Test the first field item.
-    $expected_rendered_name_field_1 = '<div class="field field-entity-test--name field-name-name field-type-string field-label-hidden">
-    <div class="field-items">
-          <div class="field-item">' . $this->referencedEntity->label() . '</div>
-      </div>
-</div>
+    $expected_rendered_name_field_1 ='
+        <div class="field-item field-item--name field-item--string field-item--entity-test--name field-item__field-label--hidden">'. $this->referencedEntity->label() .'</div>
+  ' .
+'
 ';
-    $expected_rendered_body_field_1 = '<div class="field field-entity-test--body field-name-body field-type-text field-label-above">
-      <div class="field-label">Body</div>
-    <div class="field-items">
-          <div class="field-item"><p>Hello, world!</p></div>
-      </div>
-</div>
+    $expected_rendered_body_field_1 = '
+      <h3 class="field-label field-label--body field-label--text field-label--entity-test--body">Body</h3>
+        <div class="field-item field-item--body field-item--text field-item--entity-test--body field-item__field-label--above"><p>Hello, world!</p></div>
+  ' .
+'
 ';
+
     $renderer->renderRoot($build[0]);
     $this->assertEqual($build[0]['#markup'], 'default | ' . $this->referencedEntity->label() .  $expected_rendered_name_field_1 . $expected_rendered_body_field_1, sprintf('The markup returned by the %s formatter is correct for an item with a saved entity.', $formatter));
     $expected_cache_tags = Cache::mergeTags(\Drupal::entityManager()->getViewBuilder($this->entityType)->getCacheTags(), $this->referencedEntity->getCacheTags());
diff --git a/core/modules/system/templates/field.html.twig b/core/modules/system/templates/field.html.twig
index 0745f84..b6d1ff1 100644
--- a/core/modules/system/templates/field.html.twig
+++ b/core/modules/system/templates/field.html.twig
@@ -24,7 +24,6 @@
  * - label_hidden: Whether to show the field label or not.
  * - title_attributes: HTML attributes for the title.
  * - label: The label for the field.
- * - content_attributes: HTML attributes for the content.
  * - items: List of all the field items. Each item contains:
  *   - attributes: List of HTML attributes for each item.
  *   - content: The field item's content.
@@ -39,29 +38,38 @@
  */
 #}
 {% set field_name_class = field_name|clean_class %}
+{% set entity_type_field_name_class = entity_type|clean_class ~ '--' ~ field_name_class %}
+{% set field_type_class = field_type|clean_class %}
 {%
   set classes = [
-    'field',
-    'field-' ~ entity_type|clean_class ~ '--' ~ field_name_class,
-    'field-name-' ~ field_name_class,
-    'field-type-' ~ field_type|clean_class,
-    'field-label-' ~ label_display,
+    'field-item',
+    'field-item--' ~ field_name_class,
+    'field-item--' ~ field_type_class,
+    'field-item--' ~ entity_type_field_name_class,
+    'field-item__field-label--' ~ label_display,
     label_display == 'inline' ? 'clearfix',
   ]
 %}
 {%
   set title_classes = [
     'field-label',
+    'field-label--' ~ field_name_class,
+    'field-label--' ~ field_type_class,
+    'field-label--' ~ entity_type_field_name_class,
     label_display == 'visually_hidden' ? 'visually-hidden',
   ]
 %}
-<div{{ attributes.addClass(classes) }}>
+{% if attributes.storage is not empty %}
+<div{{ attributes }}>
+{% endif %}
+
   {% if not label_hidden %}
-    <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
+    <h3{{ title_attributes.addClass(title_classes) }}>{{ label }}</h3>
   {% endif %}
-  <div{{ content_attributes.addClass('field-items') }}>
-    {% for item in items %}
-      <div{{ item.attributes.addClass('field-item') }}>{{ item.content }}</div>
-    {% endfor %}
-  </div>
+  {% for item in items %}
+    <div{{ item.attributes.addClass(classes) }}>{{ item.content }}</div>
+  {% endfor %}
+
+{% if attributes.storage is not empty %}
 </div>
+{% endif %}