等距浮动的<div>元素包含的文本破坏了布局。

要解决“等距浮动的<div>元素包含的文本破坏了布局”的问题，可以使用以下方法：

1. 使用CSS的clear属性清除浮动。在浮动元素的下方添加一个clear元素，以防止文本破坏布局。

<div class="container">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="clear"></div>
</div>

.container {
  width: 100%;
}

.box {
  width: 30%;
  float: left;
  margin: 10px;
  background-color: blue;
  color: white;
}

.clear {
  clear: both;
}

2. 使用CSS的overflow属性来修复布局问题。将包含浮动元素的容器设置为具有适当的overflow属性，以防止文本溢出。

<div class="container">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>

.container {
  width: 100%;
  overflow: auto;
}

.box {
  width: 30%;
  float: left;
  margin: 10px;
  background-color: blue;
  color: white;
}

这些方法都可以解决等距浮动的<div>元素包含的文本破坏布局的问题。你可以根据具体情况选择适合的方法来修复布局。