The gallery refuses to align to the center of the page

Question

I've been attempting to properly align my gallery array in the center of the page. I've experimented with various methods, including:

However, I have not been successful in achieving the desired result. Could someone please lend me a hand? Here is the link to the page.

Any assistance would be greatly appreciated! Thank you.

Answer 1

Answer №1

Here is the issue that needs addressing:

#content ul {
padding: 0 0 16px 30px;
}

The content is currently center aligned, but there is left padding on the ul element (30px).

To achieve center alignment for the gallery, adjust the padding as follows:

#content ul {
    padding: 0 0 16px 0;
}

It's uncertain how this change will impact other elements, so consider creating a separate class specifically for the gallery:

#content ul.gallery {
    padding-left:0;
}

Answer 2

Here is the issue that needs addressing:

#content ul {
padding: 0 0 16px 30px;
}

The content is currently center aligned, but there is left padding on the ul element (30px).

To achieve center alignment for the gallery, adjust the padding as follows:

#content ul {
    padding: 0 0 16px 0;
}

It's uncertain how this change will impact other elements, so consider creating a separate class specifically for the gallery:

#content ul.gallery {
    padding-left:0;
}