CODEWITHSUNDEEP
css
Noah Opss
Noah Opss

Reputation: 1

How to disable this CSS code on Ipad and Mobile Breakpoint?

I have a css code that I am using on my website, its working perfectly on desktop but I want to disable this on mobile and ipad devices. How can I do that?

    .sub-menu > li > a {
    color: #242424 !important;
    background: #ffffff !important;
    border: #333333 !important;
}
.sub-menu > li:hover > a {
    color: #ffffff !important;
    font-weight: bold !important;
    background: #004f94 !important;
    border: #004f94 !important;
}

Upvotes: 0

Views: 198

Answers (1)

Brakke Baviaan
Brakke Baviaan

Reputation: 468

Good day,

in order to disable the setting for mobile only, you need to set the @media rule. It creates a container for css attributes that are only applied when fitting the specified criteria. Non specified criteria are inherited. If you want to read more about css rules, you can do this in the link below: https://www.w3schools.com/css/css_rwd_mediaqueries.asp

.sub-menu > li > a {
color: #242424 !important;
background: #ffffff !important;
border: #333333 !important;


@media screen and (min-width: 420px){

.sub-menu > li > a {
color: #ffffff;
background: #ffffff;
border: #333333;
}
}

Upvotes: 2

Related Questions