Custom CSS not Working When X Theme Pro Mobile layout is active @ 768px wide

[itsthehype]

Custom CSS not Working When X Theme Pro Mobile layout is active @ 768px wide

[rad]

Hi @itsthehype,

Thanks for reaching out.

May I know what styling do you expect to see? For the meantime, please make sure your custom @media CSS is properly closed. Example,

@media only screen and (min-width:769px){
    .e191-13{
        display:flex;
        width:100%;
    }
    .e191-13 .x-column{
        flex:1;
        min-height:235px;
    }
    .e191-41{
        display:none;
    }
    @media only screen and (max-width:1024px){
        #contact-newproject{
            padding:0em 0em 0em 0em !important;
        }
    }
    @media only screen and (max-width:768px){
        #contact-newproject{
            padding:0em 0em 0em 0em !important;
        }
    }
    .e191-51{
        display:none;
    }
    .e191-60{
        display:none;
    }
    .e191-69{
        display:none;
    }
    

There is no } after this

.e191-41{
        display:none;
    }

to close the first @media only screen and (min-width:769px){

Thanks!

[itsthehype]

Hmm, I can’t find that @media only screen and (min-width:769px){

[itsthehype]

How are you finding these lines of code?
Is it a browser tool?

I found it and fixed it

It looks like that was the problem, its fixed, thanks for your help!

For the future, could show me how you found that line of code?

[nabeel]

Hi again,

We found the code using Chrome’s developers tool (see screenshot)

To learn more about developers tool, please see:

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

Hope this helps!