PySide6中QTextEdit调用setHtml无法实现两个div并排的解决方法

• Qt的QTextEdit富文本引擎仅支持有限的CSS特性，像flexbox这类CSS3布局方式并不被支持，这就是你用flex、inline-block等方式无效的原因。
• 最可靠的替代方案是使用HTML表格（<table>）来实现并排布局，这在QTextEdit中能稳定工作。

修改后的HTML代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>About</title>
</head>
<body>
    <table style="border: 1px solid black; width: 100%;" cellpadding="10">
        <tr>
            <td style="width: 33%; text-align: right;">
                RIGHT DIV :<br/>
                header 1 :<br/>
                head 02 : <br/>
                header :<br/>
                head 003 :<br/>
                last header :<br/>
            </td>
            <td style="width: 67%;">
                LEFT DIV<br/>
                content 1<br/>
                content 2<br/>
                content 3<br/>
                content 4<br/>
                <span style="font-style: italic;">last content</span>
            </td>
        </tr>
    </table>
</body>
</html>

说明： #

• 用表格的<tr>（行）和<td>（单元格）实现左右分栏，通过width属性设置1:2的比例，对应你原来的flex:1和flex:2。
• cellpadding用来替代原来的margin-right，实现单元格内的间距。
• 表格边框样式和你原来的外层div保持一致。

如果想尝试块级元素写法，也可以试试Qt有限支持的float方案，但稳定性远不如表格：

<div style="border:1px solid; overflow: auto;">
    <div style="width: 33%; text-align: right; float: left; margin-right: 10px;">
        RIGHT DIV :<br/>
        header 1 :<br/>
        head 02 : <br/>
        header :<br/>
        head 003 :<br/>
        last header :<br/>
    </div>
    <div style="width: 64%; float: left;">
        LEFT DIV<br/>
        content 1<br/>
        content 2<br/>
        content 3<br/>
        content 4<br/>
        <span style="font-style: italic;">last content</span>
    </div>
</div>

这种方式在内容高度不一致时容易出现排版错乱，表格布局依然是首选。

内容的提问来源于stack exchange，提问作者camille