-1

我在我的博客http://kasperikoski.blogspot.fi中添加了一个新的小部件，它基本上通过使用“添加 HTML/脚本”作为菜单工作。代码是给博主的 HTML/CSS：

    .menukadn   {
    line-height: 1;
    }

    a.limeka, a.limeka:visited, a.limeka:active {
    font-family: 'Maven Pro', sans-serif;
    font-size: 30px;
    font-weight: bold;
    color: #bbb;
    text-decoration: none;
    text-transform: uppercase;
    transition: color 150ms linear;
    letter-spacing: -0.090em;
    }

    a.limeka:hover  {
    color: #21a97e;
    transition: color 150ms linear;
    }

到小部件：

    <div class="menukadn">
    <a href="https://www.facebook.com/Kadnnn" class="limeka" title="" target="_blank">Facebook</a>
    <br/>
    <a href="http://instagram.com/kasperikoski" class="limeka" title="" target="_blank">Instagram</a>
    </div>

当我尝试像这样添加定位时，

    .menukadn   {
    line-height: 1;
    position: fixed;
    }

或者将小部件 DIV#HTML1 替换为自身：

    #HTML1 {
    position: fixed;
    }

它在 Mozilla Firefox 上完美运行，但在 Chrome 中，我的小部件#HTML1 位于距离它应该在的位置（列-左-外）大约 800 像素处，就在内部主体左边框旁边。任何可能有其他代码引起矛盾的想法？

4

1 回答 1

1

除了定位之外，position:fixed您还没有定义元素的位置，例如

#HTML1 {
   position: fixed;
   left:0;
   top:0;
}

如果你想根据屏幕宽度来定位它，你可以尝试这样的事情：

#HTML1 {
   position: fixed;
   left:0;
   right:0;
   width: 200px;
   margin:0 auto;
}

唯一的缺点是你必须定义一个宽度，然后再玩，left或者right直到你把它放在你想要的地方。

于 2013-04-22T17:22:55.107 回答