我试着把我的.span放在我的.texto旁边，但是当我设置我的.span的宽度时，它们会折叠，我该怎么办？

在这种情况下，你可以尝试使用CSS的flexbox布局来解决问题。Flexbox布局提供了一种强大的方式来处理元素的布局和对齐。

首先，你可以将包含.span和.texto的父元素设置为flex容器，使用display: flex属性。这样可以确保它们在同一行上。

然后，你可以使用flex属性来指定.span和.texto的比例。通过将flex属性设置为1，表示它们在水平方向上平均分配可用空间。例如，你可以将.span的CSS样式设置为flex: 1，.texto的CSS样式设置为flex: 2。这样.texto将会占据.span的两倍宽度。

接下来，你可以使用min-width或max-width属性来限制.span的宽度，以防止它们折叠。例如，你可以将.span的CSS样式设置为max-width: 50%，这样它将不会超过容器宽度的50%。

最后，你可以使用white-space属性来控制文本的换行方式。默认情况下，white-space属性设置为normal，即文本会自动换行。如果你不希望文本换行，可以将white-space属性设置为nowrap。例如，可以在.texto的CSS样式中添加white-space: nowrap。

综上所述，你可以尝试以下CSS代码来解决问题：

.parent {
  display: flex;
}

.span {
  flex: 1;
  max-width: 50%;
}

.texto {
  flex: 2;
  white-space: nowrap;
}

希望这个解决方案能够帮助你解决问题。如果你需要更多关于CSS flexbox布局的信息，可以参考腾讯云云开发的相关文档：CSS Flexbox布局。