You got this sorted, right ?
It looks normal.
Not quite sorted – but it only seems to be a problem when viewing the website in Internet Explorer.
Bush
(@manishkumarruhil)
There is a separate css file for IE in twentytwelve/css .
Try editing following codes in it:
img.size-full,
img.size-large,
img.header-image,
img.wp-post-image,
img[class*=”align”],
img[class*=”wp-image-“],
img[class*=”attachment-“] {
width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */
}
change its values to those you have written above and it should sort the the issue.
The header image in original Twentytwelve theme doesn’t have this problem. Your site’s header image looks normal ( at leaste to me ) in FF and IE8 There is no need to do anything to theme’s CSS.
Another different issue is that your child stylesheet should have @import to pull it all from parent as opposed to a copy over. As it is now, when you make changes directly to the copy over, it’s hard to debug.
Thank you.
I have just tried the suggested solutions but it doesn’t change anything.
But I can see that the ie.css file is for older IE versions (previous to IE9) and I see the problem in IE10.
and I see the problem in IE10.
Could you make sure that the Compatibility View is off.
http://windows.microsoft.com/en-us/internet-explorer/use-compatibility-view#ie=ie-10
When Compatibility View is on I actually get a sharp image but a different styling.
Bush
(@manishkumarruhil)
Many themes have different coding to support different browsers. find similar coding throughout the theme and change them in proportion to what you have changed.
When Compatibility View is on I actually get a sharp image but a different styling.
So there is no issue with header image styling in Twentytwelve.
You could investigate the problem of “different styling” in IE10 by first make sure that it’s only occur on your child theme or to the parent theme too by temporary switching to Twentytwelve.
Edit: Wait a min, when it’s on ? It must be off.
When it’s on the image is Sharp – when it’s off it’s blurry.
Now I have switched the theme to the original twente twelve and uploaded the header image. It gets blurry the same way(in IE10).
Bush
(@manishkumarruhil)
It is showing very little blurry in IE. I think may be the issue is not with your theme/website but with IE and you should not worry about it.
One possibly reason could be that IE may be loading image in low quality like many mobile browser do to speed up page loading.
I was having the same prob with IE blurry header image. I noticed the header image resizing a few px away from original dimensions. I wondered how efficiently IE dealt with the new REM values, so I commented it out for the site class in my child theme. That seemed to fix the problem for me.
.site {
margin: 0 auto;
max-width: 960px;
/*max-width: 68.571428571rem;*/
overflow: hidden;
}
@ phil.dziner
That actually seems to help here as well.
Thanks a lot for that tip.
Sorry to juump in, but my question is related.
I’m very interested in extending my frontpage image all the way across and push down the the sidebar.
@webalfen it looks like you have done exactly what I’m looking for. What child-theme have you used to achieve this wide image that pushes down the side bar (and how)?
(lækkert billede iøv. 🙂
I have not yet installed a child-theme (i am completely new to WP and website creation) – and running on the pure twenty twelve, as you can see:
Thanks in advance!
