Issue with custom code

[Amreet_Gill (slider17)]

Hi

Based on the code below i am having an issue with the width of the .demo_wrapper div i have on my site. It is displaying correctly in desktop and tablet mode, but on both mobile views its displaying with a width equal to what is written in the custom code below.

What should i write so it uses its default value in mobile view??

https://preview.webflow.com/preview/threedvue?preview=158927cdf8fb877a5e1be6b86f4fdee6

     <style>
@media (max-width: 1024px) {
    .hero-header {
        margin-top: 100px;
}

  
    .demo_wrapper {
        width: 725px;
    }
}
</style>

[Waldo (Waldo Broodrÿk)]

Hey @Amreet_Gill

Any reason you’re using custom code for width?

The code would be:

.demo-wrapper {
max-width: 725px;
width: 100%; }

That would make it responsive (with a max-width of 725px). You can do this in Webflow, no need for the custom code. Apply the same settings on the div using the Style editor pane.

[Amreet_Gill (slider17)]

thanks @Waldo
it works now!