Re-edit images to 4 rows of 5 pictures

[Atron]

Hey guys, back again with a new code. Been looking everywhere. I want to re-order the images to where it’s 4 rows of 5 pictures
Link to my website is KnightScapersps.com if you want to take a look at how it looks now and see why it’s frustrating

https://codepen.io/Atron/pen/PXGjQL

[Beverleyh]

You’ve forgotten to include your HTML, and streamline your CSS in the CodePen. Remember that we only need the very basics to illustrate the layout issue – all the extra, cosmetic CSS for transitions, colours and hover effects, etc., aren’t really necessary here. Keeping the pen code small so that its easier for potential helpers to digest and focus their efforts on, will make helpful responses more likely. Help us to help you.

However, it sounds like you can put a max-width on the image wrapper element and make it just wide enough to fit 5 images side-by-side.

[Paulie_D]

Indeed…..changing the ul CSs to

    width: calc(204px * 5);
    height: auto;
    left: 0px;
    margin: 1em auto;

Seems to be about right….

[Author]

Posts