Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have an image on my site, which is showing up as the wrong image. When I "inspect element" in chrome, and click on the link to the image, it shows up as the right image.

How can this be?

Here's the page: http://goinspire.com/israel-family-tours/

The image is the blue triangle that appears when you scroll down.

The image: http://goinspire.com/wp-content/uploads/arrow2.gif

Thanks!!

share|improve this question

closed as off-topic by s_ha_dum, t f, kaiser, brasofilo, Johannes Pille Sep 17 '13 at 19:22

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Questions should be specific to WordPress within defined scope (merely happening in its context, such as generic PHP/JS/HTML/CSS, is insufficient). Might be better asked at Stack Overflow or other appropriate site of Stack Exchange network." – s_ha_dum, t f, kaiser, brasofilo, Johannes Pille
If this question can be reworded to fit the rules in the help center, please edit the question.

    
What should the image be? –  s_ha_dum Sep 17 '13 at 15:14
    
Thanks! It's this: goinspire.com/wp-content/uploads/arrow2.gif –  user3515 Sep 17 '13 at 15:27
    
this is because you are mentioned the height and width 122 *105 then it should work –  Fresher Sep 17 '13 at 15:49
    
When I uncheck those 2 CSS elements, the picture disappears. Was that what you meant? –  user3515 Sep 17 '13 at 16:15

1 Answer 1

up vote 0 down vote accepted

You are only seeing the top of the image, because your background image is much larger than the size you have for #smoothup in the css:

in style.css #smoothup {height: 40px; width: 90px;}

The actual image is 122 x 105.

You need either:

1: modify the css defining #smoothup to fit the size of the background image

or

2 modify the background image to fit the size of the container

or

3: use CSS3 background-size to scale the background image (not supported in IE8 and below) and would look wrong because you are not matching the aspect ratio.

If you are deliberately scaling the image down for retina display, you put it in the code as an img element and scale down with css, but maintain the aspect ratio

share|improve this answer
    
Cool!!!! I didn't even think that maybe it was a scaling problem. Thanks! –  user3515 Sep 17 '13 at 17:58

Not the answer you're looking for? Browse other questions tagged or ask your own question.