html - position=fixed 不适用于移动新闻行情

Question

position=fixed 对于我网页上的某些元素工作正常，但它不适用于必须位于页面底部的新闻自动收报机。请帮我找出错误。提前致谢 ! 这是我的 CSS 代码:-

.sticky_menu
    {
    position:fixed;
    //-webkit-transform: translate3d(0, 0, 0);
    //float:bottom;
    //height:200px;
    //width:1218px;
    //border:3px solid green;
    //box-shadow:0px -5px 5px #888888;
    }

                   #wrapper {
                width: 100%;
                margin: -100px 0 0 0;
                position: relative;
                left: 0;
                //top: 50%;
                font-family: Arial, Geneva, SunSans-Regular, sans-serif;
                font-size: 14px;
                color: #333;
                line-height: 22px;
                //min-height: 300px;
                //height: 100%;
                padding: 0;
                margin: 0;
            }
            #wrapper h3 {
                font-size: 20px;
                text-align: center;
            }

            #wrapper > div {
                background-color: #eee;
                border-top: 1px solid #ccc;
                border-bottom: 1px solid #ccc;
                width: 100%;
                height: 30px;
                padding: 15px 0;
                overflow: hidden;
            }
            #wrapper > div.first {
                border-bottom: none;
            }

            #wrapper dl {
                display: block;
                margin: 0;
            }
            #wrapper dt, #wrapper dd {
                display: block;
                float: left;
                margin: 0 10px;
                padding: 5px 10px;
            }
            #wrapper dt {
                background-color: #f66;
                color: #fff;
            }
            #wrapper dd {
                color: #333;
                margin-right: 50px;
            }

            code {
                font-style: italic;
            }

这是我的 html 代码:-

<div class="sticky_menu">

<div id="wrapper">
            <div class="first">
                <dl id="ticker-1">
                    <dt>1.5.2014</dt>
                        <dd> APM Report updated</dd>

                    <dt>7.5.2014</dt>
                        <dd>EBAR(Account Level)report updated</dd>

                    <dt>9.6.2014</dt>
                        <dd>Digital Dashboard Pivot Table Report updated</dd>

                    <dt>10.6.2014</dt>
                        <dd>Safekey Report updated</dd>
                    <dt>13.5.2014</dt>
                        <dd>POINT Tool launched</dd>
                    <dt>1.6.2014</dt>
                        <dd>EBAR(Account Level) Report launched</dd>
                </dl>
            </div>

        </div>

</div>

这是我指的新闻行情:- http://coolcarousels.frebsite.nl/c/9/

Answer 1

我在 http://coolcarousels.frebsite.nl/c/9/ 检查了你的代码

我认为主要问题是你的 z-index，#c-footer 有 z-index: 10，所以即使你给 position:fixed 和 bottom:0;它会隐藏在#c-footer div 后面，所以你需要增加你的 News ticker(#wrapper) div 的 z-index

#wrapper {
  bottom: 0;
  margin: -100px 0 0;
  position: fixed;
  width: 100%;
  z-index: 20;