0

我已经创建了一个 HTML5/reponsive-ish 页面,现在正在使用媒体查询来创建一个单独的 iPhone 版本。它仍在进行中,有很多问题,但有一个问题让我有点发疯。

我的智能手机布局与我的台式机/iPad 版本有很大不同,所以我不得不使用绝对定位来将 iPhone 资产放置到位。我有一些标题文本,无论我做什么,都不会覆盖盒式磁带图像 div。

这是标题css:

`   #playlistTitle {
        width:140px;
        height:32px;
        position:absolute;
        top:120px;
        left:60px;
        z-index:500;
        background-color:transparent;
        border:1px solid red;
        text-align:center;
`

这是它应该分层的div:

`    #reelWrapper {
    height:137px;
    width:254px;
    position:absolute;
    margin:156px 6px 6px 16px;
    background:url(../images/cassette.jpg) no-repeat 0 0;
    z-index:50;
}
`

您可以在 iPhone 上看到标题 div 的底部位于磁带图像 div 的下方(我使用可见边框来显示它无法正常工作的位置)。我想要的是让它在上面分层,这样我就可以把它向下移动,看起来像这样: http: //lisadearaujo.com/clientaccess/wot-sound/images/screen.jpg

该页面在这里: http: //lisadearaujo.com/clientaccess/wot-sound/indexiPad.html

您可以通过源代码看到其余的 CSS,显然......

任何想法,我都会非常非常感激!

4

1 回答 1

0

检查您div的 s 上包含的 z-index#playlistTitle

于 2013-02-14T00:04:54.793 回答