Css 控制文本长度，而不破坏中心定位

我有一些正文和页面设置，可以使我的站点中的所有内容都很好地居中，这是我的目标。 然而，我在中间也有一些文本，当它很长的时候，这些文本现在沿着页面的整个宽度延伸。每次我尝试设置css宽度属性时，比如max width，它都会决定在其位置上失控，并将自身置于中心的最左侧

我想我的整个页面中心定位和将任何类型的宽度属性设置为div都有问题

例如，内容居中，但文字杂乱无章：

当我尝试设置任何类型的宽度时：

我很感激你的任何想法。多谢各位-威尔逊 css：

---

如果块元素上有固定的宽度，只需给它

margin:0auto以使其居中
 如果块元素的宽度固定，只需给它
边距：0 auto以使其居中

 *{
 margin:0;
 padding:0;

 }

body{
text-align:center; /*For IE6 Shenanigans*/
 }

button {
color: #900;
font-weight: bold;
font-size: 150%;
text-transform: uppercase;


 }

h1{
margin-top:20px;
font-size: 250%;
overflow:hidden; /* older browsers */
font-family: hobeaux-rococeaux-sherman, sans-serif;



}

img {
max-width:500px;
max-height:340px;
box-shadow: 1px 5px 5px grey;
border-style: groove;
border-width: 1px;
margin-top:20px;
}

#ShowText{

overflow:hidden; /* older browsers */
word-wrap: break-word;
padding-top: 100px;

font-size: 18px;
font-family: vendetta, serif;
line-height: 25px;

}