diff --git a/e2e/testcafe-devextreme/tests/editors/htmlEditor/etalons/htmleditor-ordered-list-text-appearance (fluent.blue.light).png b/e2e/testcafe-devextreme/tests/editors/htmlEditor/etalons/htmleditor-ordered-list-text-appearance (fluent.blue.light).png
new file mode 100644
index 000000000000..e6107b6a84a8
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/editors/htmlEditor/etalons/htmleditor-ordered-list-text-appearance (fluent.blue.light).png differ
diff --git a/e2e/testcafe-devextreme/tests/editors/htmlEditor/list.ts b/e2e/testcafe-devextreme/tests/editors/htmlEditor/list.ts
index 1964c715d4b0..c1682ea1d083 100644
--- a/e2e/testcafe-devextreme/tests/editors/htmlEditor/list.ts
+++ b/e2e/testcafe-devextreme/tests/editors/htmlEditor/list.ts
@@ -24,6 +24,24 @@ const orderedListMarkup = `
   </ol>
 `;
 
+const orderedListWithTextMarkup = `
+  <p>Text</p>
+  <ol>
+    <li>Text
+      <ol>
+        <li>1</li>
+        <li>2</li>
+      </ol>
+    </li>
+    <li>Text
+      <ol>
+        <li>1</li>
+        <li>2</li>
+      </ol>
+    </li>
+  </ol>
+`;
+
 fixture`HtmlEditor - lists`
   .page(url(__dirname, '../../container-extended.html'));
 
@@ -42,3 +60,19 @@ test('ordered list numbering sequence should reset for each list item (T1220554)
     value: orderedListMarkup,
   });
 });
+
+test('should reset nested ordered list counters when preceded by text (T1320286)', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await testScreenshot(t, takeScreenshot, 'htmleditor-ordered-list-text-appearance.png', { element: '#container' });
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => {
+  await createWidget('dxHtmlEditor', {
+    height: 200,
+    width: 200,
+    value: orderedListWithTextMarkup,
+  });
+});
diff --git a/packages/devextreme-scss/scss/widgets/base/_htmlEditor.scss b/packages/devextreme-scss/scss/widgets/base/_htmlEditor.scss
index bb4d980eca6a..01654a19b914 100644
--- a/packages/devextreme-scss/scss/widgets/base/_htmlEditor.scss
+++ b/packages/devextreme-scss/scss/widgets/base/_htmlEditor.scss
@@ -24,6 +24,14 @@ $transparent-border: 1px solid transparent;
   @return list-#{$counter};
 }
 
+@function add-counter-set($counter, $start: 1) {
+  @if $counter > $start {
+    @return add-counter-set($counter - 1, $start) + " " + list-#{$counter} + " 0";
+  }
+
+  @return list-#{$counter} + " 0";
+}
+
 @mixin if-less-then-max-indent($value) {
   @if $value < $max-indent {
     li.ql-indent-#{$value} {
@@ -196,7 +204,11 @@ $transparent-border: 1px solid transparent;
     padding: 2px 5px;
   }
 
-  ol,
+  ol {
+    padding-inline-start: 1.5em;
+    counter-reset: add-counter-reset($max-indent);
+  }
+
   ul {
     padding-inline-start: 1.5em;
   }
@@ -240,7 +252,6 @@ $transparent-border: 1px solid transparent;
   }
 
   li[data-list="ordered"] {
-    counter-reset: add-counter-reset($max-indent);
     counter-increment: list-0;
 
     &::before {
@@ -248,6 +259,10 @@ $transparent-border: 1px solid transparent;
     }
   }
 
+  li[data-list="ordered"]:not([class*="ql-indent"]) {
+    counter-set: add-counter-set($max-indent);
+  }
+
   @include add-counter($max-indent);
   @include add-indent-styles($max-indent);