Fix #4859, #4530: Images in 'li' tags display in inline rather than block mode.

app/src/sharedTest/java/org/oppia/android/app/parser/HtmlParserTest.kt

@@ -508,9 +508,10 @@ class HtmlParserTest {
     val imageSpans = htmlResult.getSpansFromWholeString(ImageSpan::class)
     assertThat(imageSpans).hasLength(1)
     assertThat(imageSpans.first().source).isEqualTo("test.png")
+
     // Verify that the image span does not start/end with a space since there is other text present.
     assertThat(htmlResult.toString()).startsWith("A")
-    assertThat(htmlResult.toString()).doesNotContain(" ")
+    assertThat(htmlResult.toString()[htmlResult.length - 1].toString()).doesNotContain(" ")
   }
 
   @Test

utility/src/main/java/org/oppia/android/util/parser/html/HtmlParser.kt

@@ -94,6 +94,12 @@ class HtmlParser private constructor(
       htmlContent = modifiedHtmlContent
     } else {
       htmlContentTextView.textDirection = View.TEXT_DIRECTION_LTR
+      val regex = Regex("""<oppia-noninteractive-image [^>]*>.*?</oppia-noninteractive-image>""")
+      val modifiedHtmlContent = rawString.replace(regex) {
+        val oppiaImageTag = it.value
+        """<div>$oppiaImageTag</div>"""
+      }
+      htmlContent = modifiedHtmlContent
     }
 
     htmlContentTextView.invalidate()

utility/src/main/java/org/oppia/android/util/parser/image/UrlImageParser.kt

@@ -317,7 +317,7 @@ class UrlImageParser private constructor(
         }
 
         val drawableLeft = if (imageCenterAlign && !isRTLMode()) {
-          calculateInitialMargin(maxAvailableWidth, drawableWidth)
+          calculateInitialMargin(maxAvailableWidth - maxContentItemPadding, drawableWidth)
         } else {
           0f
         }