减少iphone的表格包装宽度 [英] Reducing table wrapper width for iphone

问题描述

我正在制作小型jQuery应用程序。在这里我使用

I am making small jquery app. In it i am using DataTables to show some information on a grid. I am having a slight issue with its display on iphone. When i display grid on my chrome or android device it is fine as you can see here i have created JSFIDDLE but on iphone some of it is getting cut off. i keep messing around with css but not able to get a good looking grid. i basically wana reduce the width a little bit so i can fit it on iphone too.Can someone pelase advice.

Here is an example of what is throwing me off I tried the following

#example_wrapper{


    width: 50px;

}

Just as an expirement to see what changes occur and i saw that the width of table got smaller in chrome but in iphone there were no changes.

This is how it looks like on iphone.[i am using iphone simulator for this but i have actual iphone too]

So if someone can please guide me it would be great.I apologize if this is a bad question as my css knowledge is limited.

解决方案

I have managed to solve this, not sure if the best way but it does what i need so its good. I basically put the table in a div which has a data role equal to content and then i used the zoom in css for that div to zoom out .

<div data-role = "content" id="tbcontent">  

//insert table in here

</div>


#tbcontent{

zoom:80%;


}

Here is updated JSFIDDLE.

这篇关于减少iphone的表格包装宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！