I have a question. I am creating a website. so I want this text to move in painted borders of photo. How can I achieve that? Note: sorry for my poor choise of words.

enter image description here

CodePudding user response：

I am not sure but I think the below code is what you are looking for.

.box{
  text-align:center;
  border:2px solid;
  width:60%;
  margin:auto;
  padding:5px; /*optional*/
}

<div >
  <h3>Lorem ipsum dolor sit amet</h3>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse porta nisi nec lacus interdum maximus. Suspendisse pharetra consectetur mauris sit amet dignissim. Vivamus in dolor ac eros sagittis volutpat vel et massa. Morbi lectus nunc, pretium vel pellentesque quis, pharetra vitae neque. Vivamus nisi mi, dapibus sed ex in, ornare pharetra lorem.</p>
  <h3>Nam malesuada augue quis ex tempor gravida.</h3>
  <p>Nam malesuada augue quis ex tempor gravida. Duis id vulputate eros. Nunc vehicula lacus et varius mollis. Nunc ligula nunc, porta at varius id, scelerisque sed quam. Praesent sollicitudin posuere tristique. Aenean tempus, risus sit amet consectetur bibendum, libero diam euismod tellus, at semper arcu libero in neque. Duis erat enim, euismod nec nunc sed, molestie sagittis dui.</p>
  <h3>Mauris iaculis neque at iaculis accumsan.</h3>
  <p>Mauris iaculis neque at iaculis accumsan. Curabitur volutpat odio a quam tristique rutrum a vitae purus. Praesent congue lorem a justo tempor venenatis. Donec suscipit tincidunt rutrum. Pellentesque fermentum massa odio, eget posuere massa consectetur id. Suspendisse sagittis dolor in ultricies venenatis. Nulla eget aliquet quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
</div>

CodePudding user response：

this code will allow you to display the text centered on your page.

.PoemsBoi article {
    display:block;
    width:100%;
    text-align:center;
}