RSA Archer标准通知编辑问题：双栏布局CSS遭自动改写

我之前帮不少开发者处理过RSA Archer通知编辑器的样式限制问题，你的情况非常典型——Archer的内置富文本编辑器会自动清理或重写它认为不符合规范的CSS规则，比如自定义类名、float属性、外部样式块这些都会被修改甚至移除，这就是你原来的代码失效的原因。

为什么你的代码会被改写？ #

Archer的编辑器会做以下操作：

• 移除自定义的类名（比如.column-left、.row），替换成它自动生成的类（.c0、.c1等）
• 过滤掉float、box-sizing这类它不支持的布局属性
• 清理外部<style>块，只保留它认可的行内样式或生成的内部样式

可行的解决方案 #

下面两种方法都能绕过Archer的编辑器限制，实现两等宽列布局：

方案1：使用行内Flexbox布局（推荐）

Flexbox是现代布局方式，且行内样式不容易被编辑器过滤，代码如下：

<body>
  <h2>Two Equal Columns</h2>
  <div style="display: flex; gap: 10px; width: 100%;">
    <div style="flex: 1; padding: 10px; background-color: #aaa;">
      <h2>Column 1</h2>
      <p>text</p>
    </div>
    <div style="flex: 1; padding: 10px; background-color: #bbb;">
      <h2>Column 2</h2>
      <p>text</p>
    </div>
  </div>
</body>

• flex: 1让两个列自动平分可用宽度
• gap: 10px控制列之间的间距
• 所有样式都写在行内，避免编辑器修改类名或移除样式

方案2：使用Table布局（兼容性更强）

如果Flexbox在你的Archer版本中出现兼容问题，可以用Table布局，Archer编辑器对table的支持通常更稳定：

<body>
  <h2>Two Equal Columns</h2>
  <table style="width: 100%; border-collapse: separate; border-spacing: 10px;">
    <tr>
      <td style="width: 50%; padding: 10px; background-color: #aaa;">
        <h2>Column 1</h2>
        <p>text</p>
      </td>
      <td style="width: 50%; padding: 10px; background-color: #bbb;">
        <h2>Column 2</h2>
        <p>text</p>
      </td>
    </tr>
  </table>
</body>

• width: 100%让表格占满容器宽度
• 每个<td>设置width: 50%确保等宽
• border-spacing: 10px实现列之间的间距，避免使用margin（可能被过滤）

额外注意事项 #

• 永远不要使用外部<style>块或自定义类名，Archer会直接重写这些内容
• 尽量只使用行内样式，且选择Archer编辑器允许的属性（比如width、padding、background-color、display: flex等）
• 测试时先粘贴代码，点击预览确认布局是否正常，再保存

内容的提问来源于stack exchange，提问作者Траян Стойчев