移动模拟器是否有效？Css Jquery在iPad上

Hi everybody this is my jquery function to change font-size and other specific css values based on screen width.

大家好,这是我的jquery函数,根据屏幕宽度更改字体大小和其他特定的css值。

<script type="text/javascript" src="/jquery.js">
</script>
<script type="text/javascript">
var b=$(window).width();
var c=$(window).height();
$(document).ready(function() {
     get_font_size();
     set_sidebar();

});
function get_font_size()
{
var b=$(window).width();
var side_size=b*260/1440;
$("#alexa-widget img").css({"width":side_size});
$(".fb-like-box").attr("data-width",side_size); 
}
function set_sidebar()
{
var b=$(window).width();
var font_size=b*55/1440;
$("#my_tabs li").css({"font-size":font_size});
$("#justin input").attr("size",just_in);
}
</script>

I actually do a stupid math operation to find the font size and other css values for different screen sizes.What I do is I give the correct inputs for a screen width of 1440 say font size for 1440x768 is 20 px then for 1024x768 it would be 20x1024/1440.Though it is stupid it works fine and I tested with ipad and other android device using online simulators and also by changing user-agent setting in chrome and also in firefox. Indeed I was very happy but suddenly back to the start.I tested this in my ipad 2 and it failed miserably.

我实际上做了一个愚蠢的数学运算来找到不同屏幕尺寸的字体大小和其他css值。我做的是我给1440屏幕宽度的正确输入说1440x768的字体大小是20 px然后对于1024x768它将是20x1024 / 1440.虽然它是愚蠢的它工作正常,我测试了使用在线模拟器的ipad和其他Android设备,还通过改变chrome和firefox中的用户代理设置。事实上,我很高兴,但突然回到了开始。我在我的ipad 2中对此进行了测试,但它失败了。

The css code of the required elements are:

所需元素的css代码是:

@charset "utf-8";
/* CSS Document */
html
{
    height:100%;
}
#my_body {      

background: #f2f6f8;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YyZjZmOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2Q4ZTFlNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2I1YzZkMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMGVmZjkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #f2f6f8 0%, #d8e1e7 50%, #b5c6d0 51%, #e0eff9 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f6f8), color-stop(50%,#d8e1e7), color-stop(51%,#b5c6d0), color-stop(100%,#e0eff9));
background: -webkit-linear-gradient(top,  #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
background: -o-linear-gradient(top,  #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
background: -ms-linear-gradient(top,  #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
background: linear-gradient(to bottom,  #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9',GradientType=0 );
min-height:100%;
}
#wrapper { 
}
#content {
width:1150px;
margin-top:6%;
background: rgb(245,246,246);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y1ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIxJSIgc3RvcC1jb2xvcj0iI2RiZGNlMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ5JSIgc3RvcC1jb2xvcj0iI2I4YmFjNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2RkZGZlMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNWY2ZjYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(245,246,246,1) 0%, rgba(219,220,226,1) 21%, rgba(184,186,198,1) 49%, rgba(221,223,227,1) 80%, rgba(245,246,246,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(245,246,246,1)), color-stop(21%,rgba(219,220,226,1)), color-stop(49%,rgba(184,186,198,1)), color-stop(80%,rgba(221,223,227,1)), color-stop(100%,rgba(245,246,246,1)));
background: -webkit-linear-gradient(top,  rgba(245,246,246,1) 0%,rgba(219,220,226,1) 21%,rgba(184,186,198,1) 49%,rgba(221,223,227,1) 80%,rgba(245,246,246,1) 100%);
background: -o-linear-gradient(top,  rgba(245,246,246,1) 0%,rgba(219,220,226,1) 21%,rgba(184,186,198,1) 49%,rgba(221,223,227,1) 80%,rgba(245,246,246,1) 100%);
background: -ms-linear-gradient(top,  rgba(245,246,246,1) 0%,rgba(219,220,226,1) 21%,rgba(184,186,198,1) 49%,rgba(221,223,227,1) 80%,rgba(245,246,246,1) 100%);
background: linear-gradient(to bottom,  rgba(245,246,246,1) 0%,rgba(219,220,226,1) 21%,rgba(184,186,198,1) 49%,rgba(221,223,227,1) 80%,rgba(245,246,246,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 );

;
}
.headline_font {
    -moz-box-shadow:inset 1px 1px 0px 1px #f29c93;
    -webkit-box-shadow:inset 1px 1px 0px 1px #f29c93;
    box-shadow:inset 1px 1px 0px 1px #f29c93;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
    background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
    background-color:#fe1a00;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    border:1px solid #d83526;
    display:inline-block;
    color:#ffffff;
    font-family:arial;
    font-size:24px;
    font-weight:bold;
    padding:12px 40px;
    text-decoration:none;
    text-shadow:1px 1px 0px #b23e35;
    text-align:center;
}.headline_font:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
    background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
    background-color:#ce0100;
}.headline_font:active {
    position:relative;
    top:1px;
}
#header
{
    height:240px;

}
@font-face {
    font-family:mypost-font;
    src:url('http://www.pnrenquiry.in/fonts/HelveticaNeue-Roman.otf');
    font-weight:lighter;

}
@font-face {
font-family:mytitle-font;
    src:url('http://www.pnrenquiry.in/fonts/Veneer.ttf');
}

#post_my_head
{
    font-family:mytitle-font;
    font-size:28px;
}
#post_my_head a
{
    text-decoration:none;
    color:#000;
}
#post_my_content
{

    border-bottom:10px solid black;
    font-family:mypost-font;
    font-size:23px;
    text-decoration:none;
    text-align:left;

}
#posted_date_time
{
    font-size:22px;
    font-weight:bolder;
    float:left;
}
#my_site_headline 
{
    width:100%;
    display:inline;

}
.headline_font {
    -moz-box-shadow:inset 1px 1px 0px 1px #f29c93;
    -webkit-box-shadow:inset 1px 1px 0px 1px #f29c93;
    box-shadow:inset 1px 1px 0px 1px #f29c93;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
    background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
    background-color:#fe1a00;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    border:1px solid #d83526;
    display:inline-block;
    color:#ffffff;
    font-family:arial;
    font-size:24px;
    font-weight:bold;
    padding:12px 40px;
    text-decoration:none;
    text-shadow:1px 1px 0px #b23e35;
    text-align:center;
}.headline_font:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
    background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
    background-color:#ce0100;
}.headline_font:active {
    position:relative;
    top:1px;
}
/* This imageless css button was generated by CSSButtonGenerator.com */

#my_site_headline a
{
background: #ffffff;
background: -moz-linear-gradient(top,  #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
background: -webkit-linear-gradient(top,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
background: -o-linear-gradient(top,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
background: -ms-linear-gradient(top,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
background: linear-gradient(to bottom,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );




    text-decoration:none;
    border:2px #0033FF hidden;
    color:#000;
    font-size:26px;
    font-weight:bolder;
}


#nav
{
    position:fixed;
    width:82%;
    height:8%;  
/*  background: rgb(53,106,160);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM1NmFhMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzNTZhYTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(53,106,160,1) 0%, rgba(53,106,160,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(53,106,160,1)), color-stop(100%,rgba(53,106,160,1)));
background: -webkit-linear-gradient(top,  rgba(53,106,160,1) 0%,rgba(53,106,160,1) 100%);
background: -o-linear-gradient(top,  rgba(53,106,160,1) 0%,rgba(53,106,160,1) 100%);
background: -ms-linear-gradient(top,  rgba(53,106,160,1) 0%,rgba(53,106,160,1) 100%);
background: linear-gradient(to bottom,  rgba(53,106,160,1) 0%,rgba(53,106,160,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#356aa0', endColorstr='#356aa0',GradientType=0 );*/


}

@charset "utf-8";
/* CSS Document */
.button {
  font-family: Georgia;
  color: #ffffff;
  font-size: 34px;
  padding: 10px;
  padding-right: 25px;
  padding-left: 35px;
  text-decoration: none;
  text-align:center;
  -webkit-border-radius: 28px;
  -moz-border-radius: 28px;
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  text-shadow: 1px 1px 3px #666666;
  border: solid #2e2e2e 0px;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#7abbfc), to(#3f9de6));
  background: -moz-linear-gradient(top, #7abbfc, #3f9de6);
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#7abbfc, endColorStr=#3f9de6);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#7abbfc, endColorStr=#3f9de6);
  display:inline-block; /* IE is so silly */
}
.button:hover {
  background: #e62097;
}
#my_tabs 
{
    width:100%;
    list-style:none; 
    margin-left:-4%;

}


#my_tabs li
{
    float:left;
    display:inline;


}
#my_tabs li a
{
white-space:nowrap;
text-decoration:none;
/*   text-shadow: 0.2em 0.2em 0.2em #999999;
*/  color:#000;
font-family:mytitle-font;

padding-left:6%;
}

#my_post_link:link {

    text-decoration:none;
    color:#0145ec;
}
#my_post_link:visited
{
    text-decoration:none;
    color:#999;

}
#my_post_link:hover
{
    text-decoration:none;
    color:#F0F;
}

#tool-1 {
    font-family:mytitle-font;
    text-align:center;
    font-size:30px;
    color:#F00;
    width:960px;
    padding-top:15%;
    padding-left:5%;
}
#sidebar {
    right:0;
    width:18%;
    position:absolute;
    margin-top:11%;

}
#twitter_follow
{
        padding-top:3px;

}
.fb-like-box {
    padding-top:3px;
    width:100%;
}
#alexa-widget
{
padding-top:3px;

}
#recent_posts
{
    border:2px #000000 solid;
        background: rgb(76,76,76); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRjNGM0YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEyJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjI1JSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM5JSIgc3RvcC1jb2xvcj0iIzQ3NDc0NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzJjMmMyYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjYwJSIgc3RvcC1jb2xvcj0iIzExMTExMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc2JSIgc3RvcC1jb2xvcj0iIzJiMmIyYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjkxJSIgc3RvcC1jb2xvcj0iIzFjMWMxYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMzEzMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(76,76,76,1)), color-stop(12%,rgba(89,89,89,1)), color-stop(25%,rgba(102,102,102,1)), color-stop(39%,rgba(71,71,71,1)), color-stop(50%,rgba(44,44,44,1)), color-stop(51%,rgba(0,0,0,1)), color-stop(60%,rgba(17,17,17,1)), color-stop(76%,rgba(43,43,43,1)), color-stop(91%,rgba(28,28,28,1)), color-stop(100%,rgba(19,19,19,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-8 */
}
#rec_post
{
    list-style:none;
    font-style:mytitle_font;
    font-size:22px;
    color:#F00;

}
#rec_post_li a
{
    text-decoration:none;
    color:#ffffff;
    font-size:18px;



}
#my_post_links:link {

    text-decoration:none;
    color:#FFF;
}
#my_post_links:visited
{
    text-decoration:none;
    color:#999;

}
#my_post_links:hover
{
    text-decoration:none;
    color:#F0F;
}
#my_links:link {

    text-decoration:none;
    color:#000;
}
#my_links:visited
{
    text-decoration:none;
    color:#999;

}
#my_links:hover
{
    text-decoration:none;
    color:#F0F;
}

#footer { 
height:200px;
text-align:center;
font-family:mypost-font;
font-size:35px;
color:#000;
}
#justin
{
    width:100%;
    text-align:center;
    font-size:28px;
    font-weight:bolder;
    color:#F00;
    background:#000;
}

Sorry for posting a long code.Just see #content and #sidebar and #my_body.The sidebar and content fails.This is my screenshot on iPad 2.

很抱歉发布了一个很长的代码。只看#content和#sidebar以及#my_body。侧边栏和内容都失败了。这是我在iPad 2上的截图。

This is my exact problem.I get this weird spaces in the right left out without being used.The font size re-sizing works perfect but the width allocation fails.It works on my desktop,laptop and also in iPad and mobile simulators available online.Why does this happen?

这是我的确切问题。我在右边的左边得到了这个奇怪的空间而没有被使用。字体大小重新调整工作完美但宽度分配失败。它适用于我的桌面,笔记本电脑以及iPad和移动模拟器在线提供为什么会这样?

I have few more questions.Does mobile simulators work?Are they reliable for UI testing purpose.If so why did they fail in my case?The online simulators I used were link1 and link2.My website address is link3.Please help me fix this.Thank You.

我还有更多问题。移动模拟器是否有效?它们是否可靠用于UI测试目的。如果是这样,为什么他们在我的情况下失败?我使用的在线模拟器是link1和link2.我的网站地址是link3.Please帮我解决这个问题。谢谢。

1 个解决方案

#1

This is a complex way to solve a simple thing!

这是解决简单事情的复杂方法!

The best way to scale things is to use the viewport settings: http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

扩展事物的最佳方法是使用视口设置:http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

You can use this to scale the whole display up or down as needed.

您可以根据需要使用它来向上或向下缩放整个显示。

You then typically use Media Queries ( http://css-tricks.com/css-media-queries/ ) to change the font-size or other properties as required.

然后,您通常使用媒体查询(http://css-tricks.com/css-media-queries/)根据需要更改字体大小或其他属性。

If that isn't enough, you can use viewport relative units (rather than px or em, you use vw, vh and vmin) to size things.

如果这还不够,您可以使用视口相对单位(而不是px或em,使用vw,vh和vmin)来调整大小。

In those examples, 1vm = 1% of viewport width, 1vh is for height, and 1vmin is which ever is smallest.

在这些示例中,1vm =视口宽度的1%,1vh用于高度,1vmin是最小的。

Here's an example relating to your problem: http://css-tricks.com/viewport-sized-typography/ These are supported in iOS 6.

以下是与您的问题相关的示例:http://css-tricks.com/viewport-sized-typography/这些在iOS 6中受支持。

1 个解决方案

#1

更多相关文章

随机推荐