How do I center the button "Education Oppurtunities" in this container?-CodePudding

// I need the button "Education Opportunities centered. Every time I try it centers everything after this

<div >
          <div >
         <div >
          <h3>
            <a  href="/Education">Education</a>
           </h3>
           <p>
            Remain up to date and on top of trends with ASHI's education offerings. The ASHI 
            Online Learning Center hosts a deep library of courses instructed by industry 
            leaders.
          </p>
          </div>
        <a  href="/Education">Education Opportunities</a> Need this to be 
          centered
        </div>
          <div >
          <div >
            <h3>

CodePudding user response：

Add below CSS:-

.home-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
}

CodePudding user response：

If you are using pure HTML then you have to use the tag tag. After adding this you will be able to align the elements in the center tag to be centered.

<center>
   //Code Body
</center>

And If Modified your code would work fine in this case.

<div >
      <div >
     <div >
      <h3>
        <a  href="/Education">Education</a>
       </h3>
       <p>
        Remain up to date and on top of trends with ASHI's education offerings. The ASHI 
        Online Learning Center hosts a deep library of courses instructed by industry 
        leaders.
      </p>
      </div>
      <center>
    <a  href="/Education">Education Opportunities</a> Need this to be 
      centered
      </center>
    </div>
      <div >
      <div >
        <h3>

And if you are using CSS then simply use padding or text-align: center, tag.