Reputation: 11
I'm developing a webapp with Cordova. All is fine for the moment except that in one screen, I have a div with this position:
position: absolute;
overflow-x: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
left: 0;
right: 0;
top: 300px;
bottom: 40px;
In my browser (computer or smartphone), the element is correctly positioned but in the built app, the element is something like 10 pixels below. Here is the meta "viewport":
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, target-densitydpi=device-dpi">
Does anyone can help me for that? I really don't know why the pixels are not respected.
Upvotes: 0
Views: 587
Reputation: 11
I found the solution. Never use "line-height" to specify the "height" of an element. For some reason, in the built app (not in a browser), the output height of the element is not corresponding to the line-height.
I hope this will help someone...
Upvotes: 1