How to resize custom liquid only on desktop?

[vcockerham2002]

Hi There,

I made a catalog in Canva and inserted it into a custom liquid.  It is the perfect size on mobile, but WAY to big on the desktop.  I would like it to be about half the size so you can see the whole thing without scrolling.  How to I do this? Here is the page: https://appleblossomgiftbaskets.com/pages/real-estate-catalog?_pos=2&_psq=real&_ss=e&_v=1.0

[biznazz101 · Accepted solution]

Try adding this to your Custom Liquid sections Custom CSS Settings:

{max-width: 588px;
max-height: 441px;
margin: auto;
margin-bottom: 80px;}

Result (Desktop/Mobile):

Hope that helps!
@biznazz101 

[vcockerham2002]

Thank you, where in the code should I insert this?  here is the code canva provided that i put into the custom liquid section:

<div style="position: relative; width: 100%; height: 0; padding-top: 75.0000%;
padding-bottom: 0; box-shadow: 0 2px 8px 0 rgba(63,69,81,0.16); margin-top: 1.6em; margin-bottom: 0.9em; overflow: hidden;
border-radius: 8px; will-change: transform;">
<iframe loading="lazy" style="position: absolute; width: 100%; height: 100%; top: 0; left: 0; border: none; padding: 0;margin: 0;"
src="https:&#x2F;&#x2F;www.canva.com&#x2F;design&#x2F;DAF9KX_2axY&#x2F;xMVxOp3Vn2zT6D-Aj1BSUQ&#x2F;view?embed" allowfullscreen="allowfullscreen" allow="fullscreen">
</iframe>
</div>
<a href="https:&#x2F;&#x2F;www.canva.com&#x2F;design&#x2F;DAF9KX_2axY&#x2F;xMVxOp3Vn2zT6D-Aj1BSUQ&#x2F;view?utm_content=DAF9KX_..." target="_blank" rel="noopener">Real Estate Catalog</a> by veronica

[vcockerham2002]

I just noticed the section you were talking about.  got it! thank you!