Viewport CSS query not working

Design help General
1

Hi.

I am having problems targeting a specific viewport when adding a media query in to the custom code section (header). The specific CSS is not reflected on the website, nor is the targeted viewport visible within inspect element. This is the code:

<style type="text/css">

@media only screen 
  and (min-width: 1025px) 
  and (max-width: 1500px) {
    
.tag-line {width: 95%;
}     
</style>

The strange thing is that I am able to target the viewport below without any problems using this media working media query:

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

.sec-hero-bg {
    padding-top: 50px;
    padding-bottom: 50px;
    margin: 75px auto 0px;
}
 
</style>

Not sure, but am I missing something?
Sorry, can’t make the link public.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

You’re missing the closing } for the media query in both codes.

3

Well, even with the closing it doesn’t seem to work. Tried it out a couple of times…

4

Does this help?

http://vincent.polenordstudio.fr/snap/19xrm59.mp4

In case of: by placing your code in a custom code box at page level or at site settings level, you need to publish to see the effects. Use a Custom Code component inside of the page to see the results inside of the Designer.

5

Thanks for the tip! Even though the media query is still not working using the custom code component it’s an effective way to test things.

I am wondering if the my media query is interfering with something else… because as I mentioned other media queries work just fine.

6

But I’m using your code exactly and it works in my video.

7

A curly brace is missing at the end…Do it and it will solve your problem.

8

Hey @vincent I have a similar problem where I’m having issues with positioning between (1440px - 19020px) breakpoints and trying to use media query to solve it and it’s not working.

I can’t access your video here to see what you did here, any chance you can resend it please!