Ho to Remove an Image from Mobile Devices?

[sneedbreedley]

I have 2 waving flags bookending my header image. I would like for them NOT to appear on mobile devices.

www.winvoices.com

[sneedbreedley]

So it's working well, but when viewed on an ipad or tablet, the right flag jumps below the header image!

https://www.winvoices.com/

[osgood_]

So it's working well, but whenn viewed on an ipad or tablet, the right flag jumps below the header image!

https://www.winvoices.com/

By @sneedbreedley

Try setting max-width to 768px:

if (window.matchMedia('(max-width: 768px)').matches) {

[sneedbreedley]

Will that remove the flags when viewed on a tablet? I'd rather keep the flags on a tablet, if possible.

[osgood_]

Will that remove the flags when viewed on a tablet? I'd rather keep the flags on a tablet, if possible.

By @sneedbreedley

Then try setting the logo css to:

#logo {
display: flex;
align-items: center;
}

[sneedbreedley]

Sorry, I don't know where that code goes.

[osgood_ · Accepted solution]

Sorry, I don't know where that code goes.

By @sneedbreedley

fluid-index.css open it up and look for your #logo css selector then add:

display: flex;
align-items: center;

[sneedbreedley]

I think that worked. Thanks so much!