I am working on Phone gap. So,I need to give the code in a generic format so that it is applicable to any device.
I have a image with dimension with dimensions 2350*180.
I have tried with these codes..
width: 100%;
top: 100%;
margin-top: 50%;
but,these is not at the center for various devices.
then I tried it with
vertical-align: middle;
then
display: block;
text-align: center;
then
<table>
<tr style="vertical-align: middle;">
<td id="main" style="width: 100%;">
<img src="" />
</td>
</tr>
</table>
For all the above CSS mentioned,my output---->image sticks to the top margin to the top of the screen as If I have given margin-top:0;
Please help me and correct me.
I have 2 more questions with respect to this big image
Now, I have a background image
style="background:url("img/bg.png") no-repeat fixed center top; width:100%; height:100%; "
this code works for few only.. Is there any mistake in my code?
2nd question, is when I scroll there is scroll bar thats visible. SO I added
style="overflow:hidden;"
<img src=""/> tag.
am I correct or any other code should be added?