VF page render as pdf not working properly

Question

I am trying to display some HTML(stored as HTML text in rich text field) in to vf page via output text tag. This HTML text has unordered list inside an unordered list(like a nested unordered list). It is working fine in normal preview but when i render as PDF, it is displayed as one single unordered list instead of nested one.

PFB, the HTML text.

<div>test data</div><div><ul><li>This is line number 1</li><ul><li>This is line number 1.1</li><li>This is line number 1.2</li></ul></ul><div><br></div></div><div><ul><li>This is line number 2</li></ul><div><br></div></div>

VF page

<apex:page renderAs="pdf" controller="TsetVFController" id="myPage" applyHtmlTag="false" showHeader="false" > 
    
<h1> 
Test Code 
</h1> 
   
<apex:outputText value="{!analysis}" escape="false" /> 

</apex:page>

Controller

public with sharing class TsetVFController { 
    public String analysis {get; set;}
    public TsetVFController (){ 
        analysis = '<div>test data</div><div><ul><li>This is line number 1</li><ul><li>This is line number 1.1</li><li>This is line number 1.2</li></ul></ul><div><br></div></div><div><ul><li>This is line number 2</li></ul><div><br></div></div>';
    } 
}

Above is when previewed normally

Above is when rendered as pdf

i need the nested list in pdf as well. can anyone help.

Answer 1

Tested this with a rich text field, and the nested indentation renders in the PDF normally. If you're using the "analysis" HTML string variable like in your example, the closing LI for the "This is line number 1" list item needs to move to the end of the nested/indented UL

Original code:

analysis = '<div>test data</div><div><ul><li>This is line number 1</li><ul><li>This is line number 1.1</li><li>This is line number 1.2</li></ul></ul><div><br></div></div><div><ul><li>This is line number 2</li></ul><div><br></div></div>';

Amended code:

analysis = '<div>test data</div><div><ul><li>This is line number 1<ul><li>This is line number 1.1</li><li>This is line number 1.2</li></ul></li></ul><div><br></div></div><div><ul><li>This is line number 2</li></ul><div><br></div></div>';