Question

我在wordpress网站的custom-header.php文件中工作，我试图覆盖包含产生广播播放器的短代码的div（有点类似于this）在包含图像的div的顶部。出于某种原因，尽管使用了绝对和相对定位以及z-index，但我似乎无法将其置于图像的顶部 - 它一直在它背后。这是我在custom-header.php中的代码：

<div id="headimg">
  <div id="logo-image">
    <a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="<?php bloginfo( 'name' ); ?>" /></a>
    <div id="logo-player">
      <?php echo do_shortcode('[radioforge id=1]') ?>
    </div>
  </div><!-- end of #logo -->
</div>

和我的CSS：

#headimg #logo-image {
    width: 100%;
    overflow: hidden;
    position: relative;
}

#headimg #logo-image img {
    max-width: 100%;
    height: auto;
    border: none;
}

#headimg #logo-player {
  position: absolute;
  top: 50;
  left: 50;
  z-index: 10;
}

不确定为什么这不会产生预期的结果。我也试过给＃logo-image一个负的z-index值，但这没什么变化。我知道我的无线电播放器出现在图像后面，因为我已经将它设置为在页面加载时自动播放，我可以听到它，但由于某种原因，我无法让它坐在上面。我做错了什么？

Wordpress标题：在其他Div

0 个答案: