same settings for mobile devices and tablets

[ask9]

hi there.

i made the following changes with some custom css. BUT i also want to see all that changes below on mobile devices and tablets. (on iOS, WindowPhone, Android,..)
what i have to do?

thank you very much.

.bag-buttons a {
background-color: #d2d2d2!important;
color: #ffffff;
}

.browser-ff select {
background-image: none;
}

.tb-welcome{ display: none !important; }

.sidebar .widget-heading h4:before {
border-top: 2px solid #ddd;
}

a.reset_variations{display:none !important}

.summary .product_meta {
display: none;
}

.woocommerce .related ul.products li.product figure{
padding-top:13px !important
}

h4.spb_heading:before, h4.lined-heading:before {
border-top-color: #dddddd;
}

#product-accordion .accordion-group:nth-child(2) {
display: none;
}

#product-accordion {
display: none;
}

.additional_information_tab {
display: none !important;
}

ul.products li.product .price{font-size:14.5px !important}

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

.woocommerce div.product div.images {
width: 29%;
}
.woocommerce div.product div.summary {
width: 67%;

}
.woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price {
width: 100%;
text-align: center;
}
ul.products li.product .product-details {
display: none;
}

.bag-product figure, .woocommerce ul.products li.product figure, #product-img-slider, #product-img-nav li, .woocommerce table.shop_table img, .woocommerce-page table.shop_table img, .mini-list li figure {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

#product-accordion .accordion-body {
height: auto!important;
}

ul.products li.product .product-details {
max-width: 80%;
}

.woocommerce .wc-new-badge, .woocommerce .free-badge {
display: none;
}

.shop-actions {
display: none;
}

#product-img-slider li a.zoom {
display: none;
}

.product_meta p .leave-feedback {
display: none;
}

.posted_in {
display: none;

[Melanie – SUPPORT]

Hi, try adding an !important to each of the css to see if that catches on to mobile?

Let me know!

[ask9]

hi melanie.

i’ve just tested for the iphone but there are still the default settings. unfortunately.

[Kyle – SUPPORT]

Hi

So none of that css is applied on mobile but it works on desktop?

– Kyle

[ask9]

some of css code works also on mobile but not the whole code. maybe you can test it by yourself?!

thanks.

[Kyle – SUPPORT]

The bottom half off your custom css is within a media query to only display on screen sizes larger than 769px. Everything below:

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

to close off that media query you need to add a }

– Kyle

[ask9]

This reply has been marked as private.

[Rui Guerreiro – SUPPORT]

Closed the bracket } for you
-Rui

[ask9]

This reply has been marked as private.

[ask9]

This reply has been marked as private.

[ask9]

hello team,
any solutions? it would be really great. thank you.

[Kyle – SUPPORT]

Hi

Have you changed some settings? Getting a 404 on all of those pages

– Kyle

[ask9]

i’ve already solved it. thank you.

[Swift Ideas – Ed]

Great news!

– Ed

[ask9]

hi guys.

please check my site on an iphone for example.
for example: click on “men” > see attachment.
and the checkout page. > see attachments.

see attachments.

thanks.

Attachments:

You must be logged in to view attached files.