Please Help

[Adam Jasinski]

Hello,

I am a paid user of the Launch Pro theme. I have two major issues/problems I need help with. My website is http://www.mykidsondrugs.com

1.) In iPhone, the phone number on top in mobile view does not display, I’ve attached photo. It seems to work on Android (?)

2.) In Mobile view across all devices, the “products” section that features each product has a problem. The price of the product is not visible clearly and looks really bad until it is clicked because the price box is see-though. Is there any way to move the price box to display below the product image?

[Sonl Sinha]

Hi,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

Use phone No in tel:

Example: <a href="tel:+1 561 376 8130">+1 561 376 8130</a>

@media screen and (max-width:479px) {
#products-box .prodprice {bottom:-11px; display: inline-block; float: none; left: 0; right:inherit; position:relative; font-size:21px;}
#products-box .prodbuy a {float: right; position: relative; right: 0; bottom: 0;}
.prodbuy { float:right; margin-top:18px;}
}

Regards,
Chris

[Adam Jasinski]

Hello,

The CCS code solved part of the problem. Now the price box is below product image in mobile, but the title and “add to cart” are misaligned. Is there a CSS code that can put the title below the price box, and make them all even? Also, can the “stars” go below the image box as well, please?

Thank you for your continued help. I am planning on purchasing more themes in the future.

[Sonl Sinha]

Hi,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

Remove previous css code which i sent:

@media screen and (max-width:479px) {
#products-box .prodprice {bottom:-11px; display: inline-block; float: none; left: 0; right:inherit; position:relative; font-size:21px;}
#products-box .prodbuy a {float: right; position: relative; right: 0; bottom: 0;}
.prodbuy { float:right; margin-top:18px;}
}

Add this New css code there:

@media screen and (max-width:479px) {
#products-box .prodprice {bottom:-11px; display: inline-block; float: none; left: 0; right:inherit; position:relative; font-size:21px; width:116px !important;}
#products-box .prodbuy a {float: right; position: relative; right: 0; bottom: 0;}
.prodbuy { float:right; margin-top:11px;}
}

Regards,
Chris

[Adam Jasinski]

Hi,

Unfortunately, it did not fix the problem.

[Sonl Sinha]

Hi,

Kindly use this new css code:

@media screen and (max-width:479px) {
#products-box .prodprice {bottom:-11px; display: inline-block; float: none; left: 0; right:inherit; position:relative; font-size:21px; width:100px !important;}
#products-box .prodbuy a {float: right; position: relative; right: 0; bottom: 0;}
.prodbuy { float:right; margin-top:11px;}
}

Remove previous css

Regards,
Chris

[Adam Jasinski]

Thank you, this is perfect, now lastly, is there a way to remove the star rating on the product image or put it below the title? The star rating is in the way of the product image and provides no visual benefit being there in that spot

[Sonl Sinha]

Hi,

Kindly use this css for remove star ratings.

#products-box .review_5 { display:none !important;}

Regards,
Chris

[Adam Jasinski]

Thanks

[Sonl Sinha]

🙂

[Author]

Posts