1

I have a 25px by 25px gif, and repeating both xy in a 500x500. I overlay some images on top of it at exactly 25px. This works fine in Firefox, but Chrome seems to shrink the background gif xy by 1 pixel every 4 images! So, my overlays don't line up in Chrome, but do in Firefox. I see a Chrome table bug, but this isn't a table.

.grid2 {
float:left;
clear: both;
height:226px !important;
width:402px !important;
background:#000;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
/*background-position: left;*/
background-image:url('../bitmaps/gifs/hole.gif');
/*background-size:25px 25px;*/
background-repeat: repeat;
}

I tried without clear, important, etc. Any Ideas?

dako
  • 41
  • 5
  • I can't replicate your problem. I made a 25x25px gif with a 1px border and used your code to fill a 500x500px div. I lines up perfectly. Perhaps it's not this bit of code but something else it's inheriting? – kristina childs Apr 09 '13 at 23:22
  • background-position: left; means left center I think. And if commented, it should then be by default: center center. What happens if you try left top or 0 0 and also reset the zoom level to exactly 100% just in case? – FelipeAls Apr 09 '13 at 23:47
  • ahhh! it was because the zoom was -1!!! good call FelipeAls. Now I need to figure out how to expand the background img with the zoom scale... or not let them zoom, which is annoying. – dako Apr 10 '13 at 00:22
  • Chrome adjusts the repeated gif with zoom, but errors too small 3 out of 4 scales, at least the Ubuntu Chrome does. – dako Apr 10 '13 at 00:30
  • so, this is still an open Chrome bug... still looking for a fix to zoom fix... – dako Apr 10 '13 at 02:54

0 Answers0