How to center align headlines without turning them into paragraphs?

  • Resolved PressingWord

    (@pressingword)


    6 years, 11 months ago

    I found out that wordpress uses <p class=”text-align”></p> to center align text. The problem is that if I want to align headlines, they are nested within a <p> element, so the headlines share the paragraph’s typography, which I do not want.

    How do you solve this problem?

Viewing 4 replies - 1 through 4 (of 4 total)

  • class="”text-align”" style="text-align: center;"

    Use this inside of each heading tag.

    <p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas euismod venenatis semper. Sed sollicitudin, leo eu lacinia luctus, libero nulla congue lacus, a pellentesque tortor lectus id elit. Duis sit amet auctor arcu. In aliquam risus quis ligula ultrices, in tristique odio molestie. Donec condimentum leo sit amet est pharetra rutrum.
<h1 class="”text-align”" style="text-align: center;">First Heading</h1>
<h1 class="”text-align”" style="text-align: center;">Second Heading</h1>
<h1 class="”text-align”" style="text-align: center;">Third Heading</h1>
<h1 class="”text-align”" style="text-align: center;">Fourth Heading</h1>
</p>
    Thread Starter PressingWord

    (@pressingword)

    Thank you!

    <h1> and <p> elements are both block elements and should not be nested.

    Also, you should not have more than one <h1> element as this is used for SEO context – Google won’t like you!

    Finally, there’s a typo in the above example:

    <h1 class="”text-align”" should be <h1 class="text-align" (take out the typographer’s quotes)

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to center align headlines without turning them into paragraphs?’ is closed to new replies.

Tags