From d53b8c5b1fd485f73087c3efc2d3fe4bba34065d Mon Sep 17 00:00:00 2001 From: Alexander Ljungberg Date: Wed, 15 Aug 2012 17:13:34 +0100 Subject: [PATCH] Fixed: in Firefox the text of edited text fields would "jump" down 1 px. Locking down the line height and vertical alignment explicitly seems to work in Safari 6, Chrome 21, Firefox 14 and IE 8 (although Chrome and IE exhibit some unrelated horizontal jumping.) --- AppKit/CPTextField.j | 4 +++- AppKit/_CPImageAndTextView.j | 14 +++++++++++--- 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/AppKit/CPTextField.j b/AppKit/CPTextField.j index 8fb8cab56..8c7bab766 100644 --- a/AppKit/CPTextField.j +++ b/AppKit/CPTextField.j @@ -546,7 +546,9 @@ CPTextFieldStatePlaceholder = CPThemeState("placeholder"); element.style.top = topPoint; element.style.left = (_CGRectGetMinX(contentRect) - 1) + "px"; // -1 because input element seems to have 1px left inset element.style.width = _CGRectGetWidth(contentRect) + "px"; - element.style.height = lineHeight + "px"; + element.style.height = ROUND(lineHeight) + "px"; + element.style.lineHeight = ROUND(lineHeight) + "px"; + element.style.verticalAlign = @"top"; _DOMElement.appendChild(element); diff --git a/AppKit/_CPImageAndTextView.j b/AppKit/_CPImageAndTextView.j index 4a33f2201..c12661d1e 100644 --- a/AppKit/_CPImageAndTextView.j +++ b/AppKit/_CPImageAndTextView.j @@ -432,13 +432,15 @@ var _CPimageAndTextViewFrameSizeChangedFlag = 1 << 0, { _DOMTextShadowElement = document.createElement("div"); - var shadowStyle = _DOMTextShadowElement.style; + var shadowStyle = _DOMTextShadowElement.style, + font = (_font || [CPFont systemFontOfSize:CPFontCurrentSystemSize]); - shadowStyle.font = [(_font || [CPFont systemFontOfSize:CPFontCurrentSystemSize]) cssString]; + shadowStyle.font = [font cssString]; shadowStyle.position = "absolute"; shadowStyle.whiteSpace = textStyle.whiteSpace; shadowStyle.wordWrap = textStyle.wordWrap; shadowStyle.color = [_textShadowColor cssString]; + shadowStyle.lineHeight = [font defaultLineHeightForFont] + "px"; shadowStyle.zIndex = 150; shadowStyle.textOverflow = textStyle.textOverflow; @@ -484,11 +486,16 @@ var _CPimageAndTextViewFrameSizeChangedFlag = 1 << 0, if (_flags & _CPImageAndTextViewFontChangedFlag) { - var fontStyle = [(_font || [CPFont systemFontOfSize:CPFontCurrentSystemSize]) cssString]; + var font = (_font || [CPFont systemFontOfSize:CPFontCurrentSystemSize]), + fontStyle = [font cssString]; textStyle.font = fontStyle; + textStyle.lineHeight = [font defaultLineHeightForFont] + "px"; if (shadowStyle) + { shadowStyle.font = fontStyle; + shadowStyle.lineHeight = [font defaultLineHeightForFont] + "px"; + } } // Update the line break mode if necessary. @@ -713,6 +720,7 @@ var _CPimageAndTextViewFrameSizeChangedFlag = 1 << 0, textStyle.left = ROUND(textRectX) + "px"; textStyle.width = MAX(CEIL(textRectWidth), 0) + "px"; textStyle.height = MAX(CEIL(textRectHeight), 0) + "px"; + textStyle.verticalAlign = @"top"; if (shadowStyle) {