2015-08-15 54 views
1

我使用谷歌浏览器设计了这个代码块,正如你在这张图片中看到的那样。CSS顶部定位在Firefox中

see image here

但是用Firefox浏览时,它不能正确显示

see image

我在做什么错?

.full-panel select { 
 
    -webkit-appearance:none; 
 
    background-color:#1B6B80; 
 
    background-position:95% 50%; 
 
    background-repeat:no-repeat; 
 
    border:1px solid #1B6B80; 
 
    border-radius:2px; 
 
    color:#FFFFFF; 
 
    display:block; 
 
    font-size:10px; 
 
    height:30px; 
 
    line-height:10px; 
 
    padding-left:5px; 
 
    padding-right:25px; 
 
    position:absolute; 
 
    right:150px; 
 
    top:30px; 
 
    width:150px; 
 
}
<form method="POST" action="/" accept-charset="UTF-8"><input name="_token" type="hidden" value="M7sQaw7MVFV4DQhoyMxdiuJPB7E5KbaWVB5U9lbp"> 
 
    <div class="full-panel"> 
 
     <input name="quick" value="1" type="hidden"> 
 
     <input class="biginput" type="text" name="name" placeholder="Set up your free website"> 
 
     <select name="domain_id"> 
 
      <option>mysite.com</option> 
 
     </select> 
 
     <input class="bigbutton" type="submit" value="Submit"> 
 
    </div> 
 
</form>

+2

请提供影响HTML代码片段中所有元素的CSS。 – sdgluck

回答

1

当你使用的位置绝对可以肯定的是它的父容器具有相对位置

.full-panel { 
    position:relative; 
} 

这样,您就可以开始顶计数像素(:30PX )相对于其容器而言并非相对于身体