2013-07-08 109 views
6

一个WordPress网站(使用创世纪框架),我设计为响应适当地显示在iPhone和HTC,但不会对三星Galaxy手机。 (在三星Galaxy S2和三星Ace上测试)我目前使用FitVids插件来使视频嵌入响应。网站不响应的三星Galaxy S2

奇怪的是,没有视频的网页上嵌入:三星手机显示看正常,但有视频的网页上嵌入,显示的页面布局,对于一个平板电脑屏幕而不是一个手机屏幕。

我已经试过各种其他插件,但他们都不来解决这个问题。

这将是巨大的,如果有人可以提供这个任何意见。

这里是我的site

这里的CSS stylesheet

+0

您使用'jquery.fitvids.js'版本'1.0'从2011年 - 也许你应该检查更新。 – birgire

+1

请发现我的帖子,并尝试通过放入媒体css –

+0

我很想看到一个很好的答案;所提供的答案中没有一个解决了为什么具有视频嵌入的页面功能与没有视频嵌入功能不同。 –

回答

2

尝试使用此

<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" name="viewport"> 
3

因为我已经发现,三星的屏幕是480 * 800像素

请与下面的CSS尝试:

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) { 

} 

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : portrait) { 

} 

谢谢

1

不建议您使用@media规则,因为移动设备与桌面上的像素大小可能会有所不同。

,而不是例如,:

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) { 

} 

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : portrait) { 

} 

添加一个容器,将有5%的利润率左的5%,利润率右:

<body> 
<div class="container"> 
# Your body goes here 
</div> 
</body> 

我发现这一个与标准@media规则相比,更方便用户使用和维护响应式设计。

相关问题