通知栏与内容重叠

Question

我正在使用此页面上的代码在网站顶部显示通知栏：

http://www.hongkiat.com/blog/show-n-hide-notification-bar/

您可以在此处查看其演示： http : //demo.hongkiat.com/show-n-hide-notification-bar/

问题在于通知栏与我的徽标重叠，我希望它实际上将其向下推。 这是我正在使用的代码：

<div class="demo-wrapper">
    <div class="notification-bar">
        <input id="hide" type="radio" name="bar" value="hide">
        <input id="show" type="radio" name="bar" value="show" checked="checked">

        <label for="hide">hide</label>
        <label for="show">show</label>

        <div class="notification-text">Hello World, you can hide this notification by clicking the close button.</div>
    </div>
</div>

我需要更改什么以使其向下推而不是重叠？

Answer 1

您是否尝试过给徽标加上“ position：relative;”？ 和“ z-index：99999;” 例如？