Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Disable Auto Zoom On Text Box / Area

Posted on 2013-11-01
17
Medium Priority
?
1,538 Views
Last Modified: 2013-12-18
Hi, i have added a few media queries to my site in order to make it more mobile friendly, and in particular for when a user is making a donation.

Does anyone know if it is possible to disable auto zoom for a text box when a user clicks into a text box / area on your website via iPhone / Android?

I've read that making the font size bigger in your media query will stop the auto focus... i've increased the font size and it seems to do the trick on iPhone browsers but it seems to have got worse (zooms in more) on Android browsers.

Please click on the link below on your mobile and then click 'Make A Quick Donation', and then click into the text area to see what i mean:

https://www.icharityu.com/mission?r=99

Thanks in advance for your help...
0
Comment
Question by:oo7ml
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 4
  • 3
  • +1
17 Comments
 
LVL 33

Expert Comment

by:Big Monty
ID: 39616634
did you try:

input[type='text'],input[type='number'],textarea {font-size:16px;}
0
 

Author Comment

by:oo7ml
ID: 39616666
Can you elaborate on this a little please, as mentioned above I have increased the font over 16px - however not sure what you mean exactly
0
 
LVL 33

Accepted Solution

by:
Big Monty earned 1400 total points
ID: 39616686
my apologies, I missed that part in your post, morning coffee hasn't kicked in yet :)

There seems to be no fix for this in android devices, only on the iPhone
0
Build and deliver software with DevOps

A digital transformation requires faster time to market, shorter software development lifecycles, and the ability to adapt rapidly to changing customer demands. DevOps provides the solution.

 
LVL 53

Assisted Solution

by:COBOLdinosaur
COBOLdinosaur earned 600 total points
ID: 39616709
You are going to have all kinds of problems with that page.  The HTML validator throws 38 errors.  Most of them are because you are specifying that it is an XHTML strict document and you are using frames.  

The page will never be relaiable with that kind of inconsistency.

I suggest you fix the errors before you try and fine tune the CSS.

validator output:
http://validator.w3.org/check?uri=https%3A%2F%2Fwww.icharityu.com%2Fmission%3Fr%3D99&charset=%28detect+automatically%29&doctype=Inline&group=0

Cd&
0
 

Author Comment

by:oo7ml
ID: 39616834
Thanks @The_Big_Daddy

@COBO - "all kinds of problems with that page" -  i haven't had any other problems other than what i have described above and i am sure none of those validation errors contribute to my original question.

How much attention and energy do major websites put into valid markup anymore. I am not saying Facebook are a good example to follow, but they just returned 37 errors... Twitter returned 13 errors...

I have tested the site in numerous different browsers on many different platforms and yet to find any problems that relate to valid markup... no major website that i am aware of passed these tests as they "seem to behind on technology".
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39617086
@oo7ml,

You can do whatever you want.  However every decision carries consequences. You are the one who needs to seek help with Web development issues.  We are just here to respond to that and each of us individually sets the terms under which we commit our time. I use a standards based approach that has managed to provide a solution around 7,000 times.

Quite frankly I don't care what happens to your site.  However I assume you do care.  The invalid code reduces your rankings with Google.  It also may result in incomplete indexing because the spiders crawl in much the same way as validators, but rather than reporting errors spiders may simple abandon the crawl. Because browsers try to work around errors there is no guarantee of how errors will be interpreted in current or future browsers.

Most important of all Facebook and Twitter can do whatever they want because they already have massive traffic and the need to optimize for performance; not attracting traffic. You are losing traffic because you have reduced accessibility, usability, and reliability that Google has raised in importance in the updates of Feb 2013, May 2013, and Sept 2013; and has made it clear that those will continue to be the primary modifiers applied to content quality.

So feel free to put anything you want on the web.  However anytime you ask a question in one of my topics here or on other sites where I participate; I will point out the errors you should be fixing.

Cd&
0
 

Author Comment

by:oo7ml
ID: 39617103
No need to take it personal... i was just pointing out that the errors have nothing to do with the question raised.

Further to your reply... we don't rely on traffic hitting our website from a search engine.

I am all for fixing these errors, but i would like to fix the original problem / post question.
0
 
LVL 43

Expert Comment

by:Rob
ID: 39674883
I've requested that this question be deleted for the following reason:

The question has either no comments or not enough useful information to be called an "answer".
0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39674884
I confirmed with my link that what the OP was asking to do was not possible. Surely that would be useful to someone in the future?
0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39708521
I understand that, but it was the only place I could find that validated the answer by a large group of people. How should I have answered that if that was the only thing I could find and I don't have (easy) access to a test environment for a demo?
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39709405
@The_Big_Daddy,

That site is neither reliable nor authoritative. Even if it was not a competing site, it is not the kind of resource I would rely on considering the low quality of the content.

The problem with NO as the answer is that you can never definitively prove a negative, and some questioners who are disrespectful and impolite will not take no for an answer.  just check profiles. If they delete a lot, abandon questions like has been done here, and give bad grades then just put them on a list of the members you won't waste time trying to help in the future.

Cd&
0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39709638
fair enough, although I do find some useful threads on the site, I don't necessarily believe it's all low quality. With links to other threads of the same topic, and other people giving the same answer, I took it as valid.

I do usually check the profiles of people I'm not familiar with, although sometimes it slips my mind.
0
 

Author Comment

by:oo7ml
ID: 39713802
I have done a lot of research on this and it really seems like this is not possible... i am therefore happy to give the points to @The_Big_Daddy as i have enough evidence that this cannot be achieved.

Waiting for moderators to reply before awarding points.
0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39714025
i'm not all that concerned about the points, i'm on EE to help out people just like they've helped me out. I just brought it up because I figured there wasn't that much data on the subject, and it may prove useful to someone else if they run across the same issue.
0

Featured Post

The top UI technologies you need to be aware of

An important part of the job as a front-end developer is to stay up to date and in contact with new tools, trends and workflows. That’s why you cannot miss this upcoming webinar to explore the latest trends in UI technologies!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question