Resolved: make center vertically by bootstrap

In this post, we will see how to resolve make <ul> center vertically by bootstrap

Question:

I have this div that is parent for ul. I tried to make ul center vertically but I do not know why I see this situation:

<div className=" d-flex align-items-center bg-primary  ">
            <ul
              className="d-flex align-items-center bg-success"
              style={{ gap: "3em" }}
            >
              <li className="bg-danger">vision</li>
              <li>consorzio</li>
              <li>contatti</li>
            </ul>
          </div>

the bg-success is not got centered in bg-primary div.

Best Answer:

Generally ul elements by default have margin you should remove it first :
global.css

ul {
   margin : 0;
}

If you have better answer, please add a comment about this, thank you!

Source: Stackoverflow.com

Question:

Best Answer:

Related