css两个span一个左一个右

在CSS中，有时我们想要在一个同一行的地方放置两个左侧和右侧的元素。这时我们可以使用CSS float属性和clear属性来实现。

.left {
   float: left;
}

.right {
   float: right;
   clear: right;
} 

上述代码中，.left类的元素被向左浮动，.right类的元素被向右浮动并且需要清除右侧浮动元素。

如果你想要让两个元素同时居中，可以将它们放在一个容器中，并给容器设置text-align: center属性：

.center {
  text-align: center;
}

.center .left,
.center .right {
  float: none;
  display: inline-block;
} 

上述代码中，.center类的容器被设置成居中，.left和.right类的元素被设置为display: inline-block来使它们在同一行中并居中对齐。