现有一段bootstrap代码： <!--/.direct-chat-messages--> <div class="direct-chat-red col-md-12 mx-1.5"> <!-- /.card-header --> <!-- Message to the right --> <div class="direct-chat-msg right"> <!--简头向右--> <div class="direct-chat-infos clearfix"> @* <span class="direct-chat-name float-left">评价</span> <!--左上文字--> *@ @* <span class="direct-chat-timestamp float-Right">23 Jan 2:05 pm</span> <!--右上文字--> *@ <div class="text-right"> <input type="submit" id="btpj" value="评价" class="btn btn-dark btn-sm" /> </div> </div> <!-- /.direct-chat-infos --> <!-- /.direct-chat-img --> <div class="direct-chat-text form-control" id="tit"> <!--评级显示--> </div> </div> </div> 但是当前的按钮submit却不在这个元素的红色范围内，如何让其重叠到元素内右置

你可以将按钮放在 `direct-chat-infos` 元素中，并设置 `text-right` 类，这样按钮就会被右对齐并覆盖在消息框的右侧。代码如下：

<!--/.direct-chat-messages-->
<div class="direct-chat-red col-md-12 mx-1.5">
  <!-- /.card-header -->
  <!-- Message to the right -->
  <div class="direct-chat-msg right"> <!--简头向右-->
    <div class="direct-chat-infos clearfix">
      <!-- <span class="direct-chat-name float-left">评价</span> <!--左上文字-->
      <!-- <span class="direct-chat-timestamp float-Right">23 Jan 2:05 pm</span> <!--右上文字-->
      <div class="text-right">
        <input type="submit" id="btpj" value="评价" class="btn btn-dark btn-sm" />
      </div>
    </div>
    <!-- /.direct-chat-infos -->
    <!-- /.direct-chat-img -->
    <div class="direct-chat-text form-control" id="tit">
      <!--评级显示-->
    </div>
  </div>
</div>

注意，你可能需要根据实际情况调整元素的样式和大小，以确保按钮可以完全覆盖在消息框的右侧。