Project Posts Not Full Width


My website uses the Sydney Pro theme, and but it currently does not display the project boxes on the home page in full width when viewed on a large screen.

Can you suggest a CSS code to resolve this? I have very limited knowledge of CSS & HTML, I’ve checked through different forums and can’t get answers.

When viewing it on my Mac Air or anything larger it leaves a blank margin on the right of the boxes.

Any help is greatly appreciated!

Hello there,

Which Mac Air do you have, which resolution?

Project images are developed to size of 480x320px, and when viewed on larger screens, they can become smaller then holding element. You can try to apply custom css code below from child theme style.css or with some css plugin like this one

@media screen and (min-width: 1920px) {
    .project-item a img {
        width: 100%;

CSS code should stretch images on screens above 1920px.

If this wont work for you, please share your page link with us so we can inspect this on your end, thanks.

All the Best!

Wow thanks for such a fast reply! My mac is 1440 x 900.

I have changed the css using the plugin but sadly it isn’t working. I just want the images to stretch to full screen when viewed on any device (but still be responsive and stack to 1 x row when viewing on an iphone for example.

The page is

Thanks again for the help!

Hello again,

Then there is no problem, but you can leave provided code for screens above 1920px.

Currently, you have 4 items, and as you can see within the demo this widget is designed for 5 elements, and when you add another one, everything will be fine.

CSS which I have provide previously is for image alternation inside already defined holding container width, and this width cannot be changed with css, because it is controlled by JS script.



Just wanted to say thank you for the help - this has completely resolved it for me :slight_smile:

You’re welcome,

And thank you for using Sydney Pro Theme.

All the Best!