Input SELECT not working on phones v6.9.3

Author	« Topic »
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/02/2018 : 08:21:04 Just installed v6.9.3, upgrading from v.6.9.2. Select dropdowns for product options are not working on iPhone or Samsung Galaxy 7. This is a clean build/new site starting with v6.9.2. No add-ons or modifications to any files. Access database hosted with ServeLink. Dropdown works fine on PC. Though the site is still "under construction," you can check this page for testing www [.] industrialmatsonline.com/Complete_Comfort_Mat I do believe the dropdowns were working for v6.9.2, but cannot say for certain. And yes, the new ECT ectcart.js file is attached to all pages. Marshall CENLYT Productions - ms designs Affordable Web Design Custom Ecommerce Designs Responsive Websites Cenlyt.com
Andy ECT Moderator 95440 Posts	Posted - 07/02/2018 : 08:59:53 Hi Marshall That's odd, doesn't work for me either on your site, tried the same combination of options on mine and no problem at all. Would it be possible to clear out all the code, just leaving the proddetail code to see if there's some sort of conflict going on? Andy Please feel free to review / rate our software
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/02/2018 : 09:14:27 I had this in my CSS .content select{height:34px;line-height:34px;font-size:14px;} I just removed it. THough I have not tested it yet, do you think that could have been the problem? Marshall CENLYT Productions - ms designs Affordable Web Design Custom Ecommerce Designs Responsive Websites Cenlyt.com
dbdave ECT Moderator USA 10468 Posts	Posted - 07/02/2018 : 09:16:23 I would look at .css Maybe you are "covering up" the select options with something invisible.
Andy ECT Moderator 95440 Posts	Posted - 07/02/2018 : 09:27:20 I removed your inline css for the detail page and the select menu then worked so it's almost certainly something there. Andy Please feel free to review / rate our software
Andy ECT Moderator 95440 Posts	Posted - 07/02/2018 : 09:43:56 Narrowing it down further it may be the float:right on div.detailoption and div.detailoptions Andy Please feel free to review / rate our software
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/02/2018 : 10:59:07 I will have to look into it further as the code I posted before for select height never caused a problem. Thanks for your help. Marshall CENLYT Productions - ms designs Affordable Web Design Custom Ecommerce Designs Responsive Websites Cenlyt.com
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/02/2018 : 12:27:07 Just a note. Problem still not solved, but I noticed on a PC when you make the screen width smaller than 768px, you cannot highlight anything in the div that contains all the product information. Not even the Add To Cart button works. The only thing that functions is the MagicThumb. This is going to take some time. Again, thanks for the help. Marshall CENLYT Productions - ms designs Affordable Web Design Custom Ecommerce Designs Responsive Websites Cenlyt.com
Andy ECT Moderator 95440 Posts	Posted - 07/02/2018 : 12:35:14 Can you remove those two floats I mentioned and see if that helps? Andy Please feel free to review / rate our software
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/02/2018 : 15:20:10 As of now, nothing I have tried seems to have solved the problem. If I remove all the CSS, it works, but I have not had the time to go item by item. I did put a border around everything and I do not see any overlaps. But as I said, this is the weird part. The header and footer work fine. The center is broken into two columns: <div class="container"> <div class="col-sm-10">PRODDEATIL SECTION - ONLY THE MAGIC THUMB WORKS IN THIS SECTION</div> <div class="col-sm-2">Everything here works fine</div> </div> This only occurs below 768px. It has to be something covering things up, but I have yet to figure out what. I will update this when I figure it out.
dbdave ECT Moderator USA 10468 Posts	Posted - 07/02/2018 : 16:32:46 I like to use Firefox developer tools - Outline>all block level elements. Something like that might help you visualize the problem.
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/03/2018 : 07:08:54 quote: I like to use Firefox developer tools - Outline>all block level elements. Great idea, but little help in this instance. I do not have time to write the details, but I had to resort to a process of elimination. Seems the detaildescription was causing the problem, but that was due to a slight modification I made to a bootstrap element. I only discovered it after removing the bootstrap CSS and everything worked fine. Put it back, no good. Anyway, problem fixed. And Andy, it was not having detailoptions and detailoption float:right. But thanks for that suggestion. Marshall CENLYT Productions - ms designs Affordable Web Design Custom Ecommerce Designs Responsive Websites Cenlyt.com
Andy ECT Moderator 95440 Posts	Posted - 07/03/2018 : 07:11:56 Glad you got it fixed but testing the css in the browser and removing those floats fixed it for me. Andy Please feel free to review / rate our software
Marshall Ecommerce Template Guru USA 1916 Posts	Posted - 07/03/2018 : 08:31:10 quote: Glad you got it fixed but testing the css in the browser and removing those floats fixed it for me. It did for me too, but that was not the root of the problem and that is what I wanted to fixed. Reason being, I use that same CSS on a few sites and wanted to make sure it was not a universal problem. In fact, the floats are still there if you check the page. Weirdly though, FireFox developer tools did not show the overlap, nor did me putting borders around everything and viewing it. That was what made it harder to find. Marshall CENLYT Productions - ms designs Affordable Web Design Custom Ecommerce Designs Responsive Websites Cenlyt.com
	« Topic »