Css styles don't work on mobile

mywebdevgirl

Hey, 

I've applied styles to the site that work on desktop and they don't work on mobile view. I've added a separate media query at max-width:600px and it still isn't working? 

Any idea how to fix this? 

Thank you!

Pablo

Hi,

1) Please attach link to your website

2) Please send the CSS you applied

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

mywebdevgirl

Okay. Thank you! 

https://atlantis-aquatics.com/

#Top_bar .top_bar_right a:not(.action_button) {color: #fff;}

body:not(.template-slider) #Header_wrapper {

    background-image: url(https://atlantis-aquatics.com/wp-content/uploads/2019/05/background-1.jpg) !important;

    background-size: cover !important;

    background-position: bottom center !important;

}

p small {display: none;}

.post-desc-wrapper {

    background: #262628;

}

.woocommerce ul.products li.product .desc {background:black!important;}

.image_frame .image_wrapper, .wp-caption img, .icon_box .icon_wrapper:before {border-color: #e2e2e2;}

.image_frame {

    border: none !important;

}

.top_bar_right_wrapper a i {

    color: white !important;

}

.image_frame .image_wrapper .image_links, .portfolio_group.masonry-hover .portfolio-item .masonry-hover-wrapper .hover-desc {background:transparent!important;}

.image_frame .image_wrapper .image_links a:hover {

    background: transparent!important;

    color: transparent!important;

}

.image_frame .image_wrapper .image_links a {

    color: transparent!important;

}

.post-desc h2 a {

    font-size: 28px;

    line-height: 0;

    font-weight: 400;

}

.pager .pages {background-color:transparent!important;}

.pager .pages a.active {background-color:#0095eb;}

.fixed-nav .arrow {background-color:black;}

.fixed-nav .desc {background: black !important;}

.accordion .question .title, .accordion .question .title > .acc-icon-plus {color:white;}

Bryan

Hey,

where did you paste this css? I am asking because it is not in theme options>custom css&js>css

thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

mywebdevgirl

I put it in the child theme appearance>theme editor

Pablo

Please disable all of the plugins, clear the cache of your browser and copy & paste that css into the theme options > custom css & js > css

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

mywebdevgirl

That didn't work. Any other ideas? 

Pablo

I think the problem is related to the "Jetpack" plugin or some mistakes with the css code before that code you sent.

I pasted that CSS you sent and it's working fine.

http://prntscr.com/nua90v

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

mywebdevgirl

That was it! Thank you!!!