IE6 news
Check out the link
To vertically center an image inside a div tag we can use display:table-cell and vertical-align: middle as the css for the div , which will work for modern browsers.
Lets take an example
Suppose I have the following markup.
We can apply the following css to get the image vertically as well as horizontally(text-align:center) centered
.image {
display: table-cell;
height: 120px;
text-align: center;
vertical-align: middle;
width: 175px;
}
Now to get the same effect on IE7 (since IE7 doesn’t support table-cell value for display) we can use jQuery.
The code is given below
jQuery(‘.ie7 .image img ‘).each(function () {
var img_height=jQuery(this).height();
var padding_value=(120-parseInt(img_height))/2+’px’;
jQuery(this).css(‘padding-top’,padding_value);
});
This code will vetically center all images contained in the div having the class “image”
var padding_value=(120-parseInt(img_height))/2+’px’; on this line 120 refers to the height of the div
Note:Image dimension should be less than the “div” dimension
The markup is as follows
<div class=”image”>
<img alt=”imagetext” src=”http://imagepath”/>
</div>
http://tech-queries.blogspot.com/2011/12/some-lesser-known-but-useful-unix.html
Check out the above link.
Guys,
If you are stuck with CSS which is having !important as a value for the property and as you must be knowing, jQuery doesn’t use !important value, and lets suppose it is a “must” thing for you to change the value through jQuery,then, you can use cssText property.
Here is an example,
Suppose i have a CSS statement.
#rtp-nav-menu li ul { display: none !important; color:#000000;}
jQuery for this is
jQuery( ‘#rtp-nav-menu li ul ‘).css({‘cssText’: ‘display: block !important’,'color’:'#000000′});
Remember that you give cssText property first as it overrides any style associated with the particular element.