Html 如何将文本与CSS相对对齐？

我试图将等式中的等号对齐。我尝试了span和DIV，但如果LHS内容大小>RHS，对齐将结束：

\(1+2\ \)  \(=\) 
\(\ 3\)


\(1+5\ \)  \(=\) 
\(\ 6 + 2 - 2\)


\(1 + 3 + 2\ \)  \(=\) 
\(\ 6 + 2 - 2\)
.ctr{位置：绝对；左侧：40%；}
.lft{位置：相对；显示：内联；}

如何对齐任何等式大小的等号？非常感谢您的帮助。

.ctr{
左边距：自动；
右边距：自动；
}

\（1+2\\）\（=\）\（\3\）

\（1+5\\）\（=\）\（\6+2-2\）

\（1+3+2\\）\（=\）\（\6+2-2\）

一个选项是，您可以简单地使用表格并将左侧项目向右浮动，即

.lft{float:right:}

检查此处的工作示例：

表如下所示：

.lft{
浮动：对；
显示：内联；
}
* {
框大小：边框框；
}
.行{
显示器：flex；
柔性包装：包装；
}
梅因先生{
弹性：80%；
背景色：白色；
填充：20px；
溢出：隐藏；
位置：相对位置；
}
.左{
弹性：20%；
背景色：#f1f1；
填充：20px；
}

东西
\(1+2\ \)                                      
\(=\)                 
\(\ 3\)                                        
\(1+5\ \)                                                         
\(=\)
\(\ 6+2-2\)                                                            
\(1+3+2\ \)                                                         
\(=\)
\(\ 6+2-2\)                                                           

@Overlord Golddragon我很荣幸。快乐编码！

<span class="ctr">
    <span class="lft">\(1+2\ \) </span> \(=\) 
    <span class="lft"> \(\ 3\)</span>
</span>
<br>
<span class="ctr">
    <span class="lft">\(1+5\ \) </span> \(=\) 
    <span class="lft"> \(\ 6 + 2 - 2\)</span>
</span>
<br>
<span class="ctr">
    <span class="lft">\(1 + 3 + 2\ \) </span> \(=\) 
    <span class="lft"> \(\ 6 + 2 - 2\)</span>
</span>

.ctr{position: absolute; left: 40%;}
.lft{position: relative; display: inline;}