Syntax: Use variable for css value

Trying to keep a box centered vertically within another box. I know there's css that can do this, but I'd rather use jquery, more reliable(?).

var textH = $(".开发者_如何转开发Text").height();
var vertAlign = ((140 - textH)/2);

$(".Text").css({
    marginTop: 'vertAlign'
});

Not sure what detail I'm missing. The output should be half the available vertical space, in pixels.

EDIT

Originally, the text block was a span contained by a div. The div had a set height (140 px in this case), and the text block, the span, would be variable height based on how much text was in it. However, I need this text block to be editable. So I changed it to a text area. however, the behavior for the dimensions of the text area is awkward, and I had to set a static height and width to it. Now the height of this text block isn't variable, so there's no difference in height between it and it's parent with which to derive the margin-top spacing from. What should I do?

---

Remove quotes surrounding vertAlign

$(".Text").css('margin-top', vertAlign);

Try the above code. It must help you.

---

optionally if you'd like to do more than one style:

var styles = {'margin-top':vertAlign,'property':100,'property':somevalue}
$(".Text").css(styles);

---

var textH = $(".Text").height();
var vertAlign = ((140 - textH)/2);
$(".Text").css({
        margin-top: vertAlign + 'px'
    });

You need to specify the unit, otherwise your browser won't be able to tell whether you want pixels or em or apples.Also you might want to do some range checking, you do not want vertAlign to be negative.