图像定位不起作用

Question

我有问题在我正在处理的页面上定位这两个按钮。我试图让点击图片链接更小。看起来绝对定位不是做它的工作或某事。

页：http://osuuskuntainfo.orgfree.com/saannot.html

<div id="yläreuna"> 

    <div id="etusivullenappi"> 

     <img class="bottom" src="/images/etusivullenappix.png" width="100%" /> 
     <a href="http://osuuskuntainfo.orgfree.com/index.html"><img class="top" src="/images/etusivullenappi.png" width="100%" /></a> 

    </div> 

    <div id="otsikko"><img src="images/säännöt otsikko.jpg" width="81%" alt="osuuskunnan säännöt" /></div> 

    <div id="pelisäännötnappi"> 

     <img class="bottom" src="/images/pelisäännötnappix.png" width="100%" /> 
     <a href="#pelisäännöt"><img class="top" src="/images/pelisäännötnappi.png" width="100%" /></a> 

    </div> 

</div> 

CSS：

#yläreuna { 
    float: left; 
    margin-left: 0px; 
    width: 100%; 
    margin-bottom: 18px; 
} 

#etusivullenappi { 
    position: relative; 
    width: 13%; 
    float: left; 
    margin-top: 42px; 
    margin-left: 4%; 
    padding-right: 8%; 
} 

#etusivullenappi img { 
    -position: absolute; 
    -left: 0px; 
    -webkit-transition: opacity 0s ease-in-out; 
    -moz-transition: opacity 0s ease-in-out; 
    -o-transition: opacity 0s ease-in-out; 
    transition: opacity 0s ease-in-out; 
    top: 0px; 
} 

#etusivullenappi img.top:active { 
    opacity:0; 
} 

Answer 1

您有：

-position: absolute; 
-left: 0px; 

想必从供应商前缀错字。这会导致财产未知，从而无法呈现。你应该写：

position: absolute; 
left: 0px;