vertical align an image in IE 6
I want to vertically middle an image. Following code works fine with all browsers accept IE6 and audience of my site is going to use IE6.
How can i vertically middle this image in internet explorer 6??
<div id="galleryImage"><div id="imgContainer"> <img src='' alt='' /> </div></div>
#galleryImage{
width:668px;
height:668px;
border:solid 1px #c0c0c0;
overflow:hidden;
float:left;
line-height:668px;
text-align:center;
}
#imgContainer{
display:inline;
height:668px;
li开发者_高级运维ne-height:668px;
}
this code done trick for me for ie6. Sharing for others who are having same problem
http://snipplr.com/view/36863/jquery-plugin-vertical-align/
img{ _display:inline-block; _vertical-align:middle}
these two style settings are the IE6 workaround...i used the IE6 hack to keep it in your style sheet, personally, when page load and optimization are extremely under control, i would serve up separate style sheet(s) for IE(s), but that is entirely up to you.
offhand, you should ditch those line-heights on both divs. i see what you're doing with line-height and i must say that i do not recommend arbitrarily throwing out styles like that. yes it almost worked cross-browser and yes, the functionality you are seeing from line-height here is desired......but that's not how line-height is intended to be used and later on down the line, be it on this site, or the massive make/break your career site, your styles will fail hard. i know from experience dude, it sucks. I've been pushing cross-browser/cross-media standards based solutions for over a year now and it was an absolute circus act juggling responsive development, mobile first development, developing in the browser and developing from the content out @ the same time. Yeah, that's a mouthful.....my point is...I had a very strong grasp on CSS2 screen media covering IE6&7,FF2,Safari,Opera....I don't even think Chrome was out yet...I'm rambling....my confidence and "perceived" knowledge plummeted as soon as i moved forward. nothing seemed to work. basically i was using styles/properties how they were unintended and the small browser list was forgiving...once i jumped in the big kids pool, i was way over my head.
that was entirely too long.
精彩评论