Media queries in wordpress child theme not being recognised

Ok I just found the solution to my problem. I was missing another set of brackets Claire this might be your issue as well.

With me I had @media (min-width: 768px) .col-sm-6 {width: 33% !important;}

Instead I needed to wrap the query with brackets like so...

@media (min-width: 768px) { <------added this .col-sm-6 {width: 33% !important;} } <----added this

Then I moved it to the top of my child theme list to ensure there wasn't any syntax errors preventing the code to run. Also added the !important rule to ensure it overrides the parent theme.

How does that compare with your issue?

I don't think this is the problem for me, my code seems to be written correctly. This is what I have...

@media (max-width: 643px) {



#home-header .home-slider {
    max-width: 100% !important;
    margin: auto !important;
}

#home-header .metaslider {
max-width: 90% !important;
margin: auto !important;
}




.circle {
display: block !important;
margin: 0 auto 30px !important;
}


#circle-3 {
    margin-right: auto !important;
}

#use .logo {
    display: none !important;
}

#use .buy-now {
    float: none !important;
    margin: 0 auto !important; 
}

}

I have copied the media query selection (@media (max-width: 643px)) to match how it it written in the parent theme but it is still not recognised. Can anyone help?

Do you have a link to this online somewhere we could troubleshoot?

NoI'm afraid it's not live yet. I'm just used '!important' on every media query attribute which has worked - I'm assuming this is the only way to override them?