#container {
  text-align : center;
  }
.button {
  border          : none;
  color           : rgba(93, 24, 172, 0.603);
  padding         : 15px 15px;
  text-align      : center;
  text-decoration : none;
  display         : inline-block;
  font-size       : 10px;
  margin          : 15px 10px;
  cursor          : pointer;
 
  }
.button1 {
  background-color : white;
  }
  
/*  added to see white text */
body { background : darkblue; }

pre{
display:inline-block;
text-align:left;
margin:0 auto;}

<div id="container">
<pre style="font-family:Calibri; color:white;border: 1px solid white;">
  Duis aute irure dolor in reprehenderit in voluptare
  velit esse cillum dolore eu fugiat nulla pariatur.
  Exceptur sint occaecat cupidatat non proident, sunt
  in culpa qui officia deserunt mollit anim id est.</pre>
<div text-align="center">
  <button class="button button1" style="text-align:right;">READ MORE</button>
</div>
</div>

你的代码的主要问题是按钮有一个绝对的位置，所以它被从正常的文档流中删除了。同样根据你的网站，你需要一些布局，或者容器围绕按钮和文本，把它们放在一起。
我把按钮移到了文本下面，并为它们做了一个容器。我还删除了一些不必要的css和html，比如按钮周围的div。

body {
  background: #496bbe
}

.Container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: fit-content;
}

.button {
  border: none;
  color: rgba(93, 24, 172, 0.603);
  padding: 15px 15px;
  font-size: 10px;
  cursor: pointer;
}

.button1 {
  background-color: white;
}

pre {
  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
  color: white;
  text-align: left;
  white-space: pre-wrap;
}

<section class="Container">
        <pre>
        Duis aute irure dolor in reprehenderit in voluptare
        velit esse cillum dolore eu fugiat nulla pariatur.
        Exceptur sint occaecat cupidatat non proident, sunt
        in culpa qui officia deserunt mollit anim id est.</pre>
        
        <button class="button button1" style="text-align:right;">READ MORE</button>
    </section>