javascript - Align Vertical text in Tooltip -
i trying vertical-align text inside tooltip cannot.
i'm usign jquery tools http://flowplayer.org/tools/tooltip/index.html
based on link provided see tooltips use following css.
<div class="tooltip" style="visibility: visible; position: absolute; left: 465px; display: block; opacity: 1; top: 253px; "> tooltip text </div>
this blog has great article on vertically centering content
http://blog.themeforest.net/tutorials/vertical-centering-with-css/
based on , assuming don't have support ie7 think display: table-cell
method. apply tooltip class. have wrap cell content first though.
div.tooltip {display:table;} div.tooltip > span {display:table-cell; vertical-align:middle;} //if can't wrap content in span use jquery $('div.tooltip').wrap('<span />'); //the new html <div class="tooltip" style="visibility: visible; position: absolute; left: 465px; display: block; opacity: 1; top: 253px; "> <span>tooltip text</span> </div>
was thinking don't know how css applied these tooltips. assigned display property block
. may need make sure alterations tooltip plugin code doesn't remove display:table
property. may want double wrap content ensure css doesn't overwritten.
Comments
Post a Comment