在标题中对齐段落文本

Question

I'm coding my first website and I am having trouble aligning the intro text. Right now the paragraph is aligned to the left which is great, but I'm trying to have the text box be only the width of 625px and right now it's spanning the entire width of the page. I tried to use padding to resolve it, but the text just remains the same width of the page. Below is my current code any help would be great!

HTML:

<header class="masthead">
  <div class="container">
    <div class="intro-text">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum. </p>
    </div>
  </div>
</header>

CSS:

header.masthead {
  text-align: left;
  color: white;
  background-image: url("../img/headshot.png");
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: right;
  background-size: 500px 601px
}

header.masthead .intro-text p {
  padding-top: 50px;
  padding-bottom: 100px;
  padding-right: 500;
}

Answer 1

Do you want to align the 625px div in the middle of the page? If so, do the following:

.masthead .container {
    margin: 0 auto; // center the div
    max-width: 625px;
}

Now your child div and paragraph block elements will automatically take the max-width of 625px.

Answer 2

 header.masthead .intro-text p {
    padding-top: 50px;
    padding-bottom: 100px;
    padding-right: 500;

    width: 625px;
  }

add a width to you'r element.