Changing position of my image in mozilla and chrome

Question

I have an image which is always changing position when viewed in chrome and mozilla. When I make it look perfect in chrome it changes position in mozilla while when i make it look perfect for mozilla it changes position for chrome. How can I make image not to change position in different browser.

#economy123{
 position:absolute;
top:67%;
left:53%;
  }



<div class="result-temp"  >
 <img id="economy123" src="{{ asset('assets/images/economy123.png') }}" >
    <p class="t"></p>

Answer 1

I think your code isn't so clear but you can set a specific position for FF only using @-moz-document url-prefix() :

#economy123{
    position:absolute;
    top:67%;
    left:53%;
}

@-moz-document url-prefix() {
    #economy123{
        top:55%; //different
        left:43%; //different
    }
}

Answer 2

<link href="/normalize.css" rel="stylesheet">

尝试将其放在html文档的开头，这应该使您的图片在所有设备和浏览器上看起来都一样。