三的div的响应IFRAME

我有三个div S和这个谷歌地图iframe代码与下面的CSS：三的div的响应IFRAME

#contact_map { border-radius: 200px; width: 320px; height: 320px; overflow: hidden; max-width: 100%; position: relative; right: 0px; } 
#contact_map_fake { border-radius: 200px; width: 320px; height: 320px; top:0px; 
    box-shadow: inset 0px 3px 5px 1px rgba(0, 0, 0, .5); pointer-events:none; position: absolute; border: 1px solid rgba(255,255,255,.6); 
} 
#contact_map_container { border-radius: 200px; overflow: hidden; width: 320px; height: 320px; }

我怎样才能改变CSS，使这个反应，使地图下的跳跃其他div当我在iPhone上查看页面？

来源

2013-05-09 Carsten

您可以使用CSS @media标签

@media screen and (max-width: 480px) and (orientation: portrait){ 
    /* some CSS here */ 
    /*define css for all divs*/ 

} 

/* #### Mobile Phones Landscape #### */ 
@media screen and (max-width: 640px) and (orientation: landscape){ 
    /* some CSS here */ 
    /*define css for all divs*/ 
} 

/* #### Mobile Phones Portrait or Landscape #### */ 
@media screen and (max-width: 640px){ 
    /* some CSS here */ 
    /*define css for all divs*/ 
}

来源

2013-05-09 10:40:56

你好，我的意思是在浏览器中，当你改变大小。地图必须适应下来。 – Carsten 2013-05-09 12:16:23

@Carsten你告诉我如何更改CSS以使其响应，以便当我在iPhone上查看页面时，地图跳转到其他div下？ – 2013-05-09 12:18:48

http://imageshack.us/photo/my-images/855/webseitey.png/ – Carsten 2013-05-09 12:20:53

使用CSS媒体查询做到这一点@media

@media all and (max-width: 640px){ 
#contact_map{ 
width: 100%; 
height: 100%; 
} 
}

来源

2013-05-09 10:45:09 Sameertha

三的div的响应IFRAME

回答

相关问题