diff --git a/core/block_render_svg_horizontal.js b/core/block_render_svg_horizontal.js
index f0c7643f01..c670702288 100644
--- a/core/block_render_svg_horizontal.js
+++ b/core/block_render_svg_horizontal.js
@@ -239,6 +239,30 @@ Blockly.BlockSvg.renderingMetrics_ = null;
  */
 Blockly.BlockSvg.MAX_DISPLAY_LENGTH = 4;
 
+/**
+ * Point size of text field before animation. Must match size in CSS.
+ * See implementation in field_textinput.
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_FONTSIZE_INITIAL = 12;
+
+/**
+ * Point size of text field after animation.
+ * See implementation in field_textinput.
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_FONTSIZE_FINAL = 14;
+
+/**
+ * Whether text fields are allowed to expand past their truncated block size.
+ * @const{boolean}
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_EXPAND_PAST_TRUNCATION = true;
+
+/**
+ * Whether text fields should animate their positioning.
+ * @const{boolean}
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_ANIMATE_POSITIONING = true;
+
 /**
  * @param {!Object} first An object containing computed measurements of a
  *    block.
diff --git a/core/block_render_svg_vertical.js b/core/block_render_svg_vertical.js
index 12f65eeb44..40b65ac330 100644
--- a/core/block_render_svg_vertical.js
+++ b/core/block_render_svg_vertical.js
@@ -324,7 +324,7 @@ Blockly.BlockSvg.FIELD_WIDTH_MIN_EDIT = 8 * Blockly.BlockSvg.GRID_UNIT;
  * Maximum width of user inputs during editing
  * @const
  */
-Blockly.BlockSvg.FIELD_WIDTH_MAX_EDIT = Infinity;
+Blockly.BlockSvg.FIELD_WIDTH_MAX_EDIT = 52 * Blockly.BlockSvg.GRID_UNIT;
 
 /**
  * Maximum height of user inputs during editing
@@ -375,6 +375,30 @@ Blockly.BlockSvg.NO_PREVIOUS_INPUT_X_MIN = 12 * Blockly.BlockSvg.GRID_UNIT;
  */
 Blockly.BlockSvg.INLINE_PADDING_Y = 2 * Blockly.BlockSvg.GRID_UNIT;
 
+/**
+ * Point size of text field before animation. Must match size in CSS.
+ * See implementation in field_textinput.
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_FONTSIZE_INITIAL = 12;
+
+/**
+ * Point size of text field after animation.
+ * See implementation in field_textinput.
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_FONTSIZE_FINAL = 12;
+
+/**
+ * Whether text fields are allowed to expand past their truncated block size.
+ * @const{boolean}
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_EXPAND_PAST_TRUNCATION = false;
+
+/**
+ * Whether text fields should animate their positioning.
+ * @const{boolean}
+ */
+Blockly.BlockSvg.FIELD_TEXTINPUT_ANIMATE_POSITIONING = false;
+
 /**
  * Change the colour of a block.
  */
diff --git a/core/css.js b/core/css.js
index fed9b918af..039a2397a0 100644
--- a/core/css.js
+++ b/core/css.js
@@ -449,7 +449,7 @@ Blockly.Css.CONTENT = [
     'margin: 0;',
     'outline: none;',
     'box-sizing: border-box;',
-    'padding: 2px 8px 0 8px;',
+    'padding: 2px 0 0 0;',
     'width: 100%;',
     'text-align: center;',
     'color: $colour_text;',
diff --git a/core/field_textinput.js b/core/field_textinput.js
index 287a156c9d..f0e5fb5203 100644
--- a/core/field_textinput.js
+++ b/core/field_textinput.js
@@ -52,16 +52,6 @@ Blockly.FieldTextInput = function(text, opt_validator) {
 };
 goog.inherits(Blockly.FieldTextInput, Blockly.Field);
 
-/**
- * Point size of text before animation. Must match size in CSS.
- */
-Blockly.FieldTextInput.FONTSIZE_INITIAL = 12;
-
-/**
- * Point size of text after animation.
- */
-Blockly.FieldTextInput.FONTSIZE_FINAL = 14;
-
 /**
  * Length of animations in seconds.
  */
@@ -171,14 +161,17 @@ Blockly.FieldTextInput.prototype.showEditor_ = function(opt_quietInput, opt_read
   this.workspace_.addChangeListener(htmlInput.onWorkspaceChangeWrapper_);
 
   // Add animation transition properties
-  div.style.transition = 'padding ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
-    'width ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
-    'height ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
-    'margin-left ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
-    'box-shadow ' + Blockly.FieldTextInput.ANIMATION_TIME + 's';
+  var transitionProperties = 'box-shadow ' + Blockly.FieldTextInput.ANIMATION_TIME + 's';
+  if (Blockly.BlockSvg.FIELD_TEXTINPUT_ANIMATE_POSITIONING) {
+    div.style.transition += ',padding ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
+      'width ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
+      'height ' + Blockly.FieldTextInput.ANIMATION_TIME + 's,' +
+      'margin-left ' + Blockly.FieldTextInput.ANIMATION_TIME + 's';
+  }
+  div.style.transition = transitionProperties;
   htmlInput.style.transition = 'font-size ' + Blockly.FieldTextInput.ANIMATION_TIME + 's';
   // The animated properties themselves
-  htmlInput.style.fontSize = Blockly.FieldTextInput.FONTSIZE_FINAL + 'pt';
+  htmlInput.style.fontSize = Blockly.BlockSvg.FIELD_TEXTINPUT_FONTSIZE_FINAL + 'pt';
   div.style.boxShadow = '0px 0px 0px 4px ' + Blockly.Colours.fieldShadow;
 };
 
@@ -249,18 +242,26 @@ Blockly.FieldTextInput.prototype.validate_ = function() {
 Blockly.FieldTextInput.prototype.resizeEditor_ = function() {
   var scale = this.sourceBlock_.workspace.scale;
   var div = Blockly.WidgetDiv.DIV;
-  // Resize the box based on the measured width of the text, pre-truncation
-  var textWidth = Blockly.measureText(
-    Blockly.FieldTextInput.htmlInput_.style.fontSize,
-    Blockly.FieldTextInput.htmlInput_.style.fontFamily,
-    Blockly.FieldTextInput.htmlInput_.style.fontWeight,
-    Blockly.FieldTextInput.htmlInput_.value
-  );
-  // Size drawn in the canvas needs padding and scaling
-  textWidth += Blockly.FieldTextInput.TEXT_MEASURE_PADDING_MAGIC;
-  textWidth *= scale;
+
+  var width;
+  if (Blockly.BlockSvg.FIELD_TEXTINPUT_EXPAND_PAST_TRUNCATION) {
+    // Resize the box based on the measured width of the text, pre-truncation
+    var textWidth = Blockly.measureText(
+      Blockly.FieldTextInput.htmlInput_.style.fontSize,
+      Blockly.FieldTextInput.htmlInput_.style.fontFamily,
+      Blockly.FieldTextInput.htmlInput_.style.fontWeight,
+      Blockly.FieldTextInput.htmlInput_.value
+    );
+    // Size drawn in the canvas needs padding and scaling
+    textWidth += Blockly.FieldTextInput.TEXT_MEASURE_PADDING_MAGIC;
+    textWidth *= scale;
+    width = textWidth;
+  } else {
+    // Set width to (truncated) block size.
+    width = this.sourceBlock_.getHeightWidth().width * scale;
+  }
   // The width must be at least FIELD_WIDTH and at most FIELD_WIDTH_MAX_EDIT
-  var width = Math.max(textWidth, Blockly.BlockSvg.FIELD_WIDTH_MIN_EDIT * scale);
+  width = Math.max(width, Blockly.BlockSvg.FIELD_WIDTH_MIN_EDIT * scale);
   width = Math.min(width, Blockly.BlockSvg.FIELD_WIDTH_MAX_EDIT * scale);
   // Add 1px to width and height to account for border (pre-scale)
   div.style.width = (width / scale + 1) + 'px';
@@ -270,7 +271,8 @@ Blockly.FieldTextInput.prototype.resizeEditor_ = function() {
   // Use margin-left to animate repositioning of the box (value is unscaled).
   // This is the difference between the default position and the positioning
   // after growing the box.
-  var initialWidth = Blockly.BlockSvg.FIELD_WIDTH * scale;
+  var fieldWidth = this.sourceBlock_.getHeightWidth().width;
+  var initialWidth = fieldWidth * scale;
   var finalWidth = width;
   div.style.marginLeft = -0.5 * (finalWidth - initialWidth) + 'px';
 
@@ -289,7 +291,7 @@ Blockly.FieldTextInput.prototype.resizeEditor_ = function() {
   // whereas the right edge is fixed.  Reposition the editor.
   if (this.sourceBlock_.RTL) {
     xy.x += width;
-    xy.x -= div.offsetWidth;
+    xy.x -= div.offsetWidth * scale;
   }
   // Shift by a few pixels to line up exactly.
   xy.y += 1 * scale;
@@ -300,7 +302,6 @@ Blockly.FieldTextInput.prototype.resizeEditor_ = function() {
     xy.y += 1 * scale;
   }
   if (goog.userAgent.WEBKIT) {
-    xy.x += 0.5;
     xy.y -= 1 * scale;
   }
   // Finally, set the actual style
@@ -347,10 +348,14 @@ Blockly.FieldTextInput.prototype.widgetDispose_ = function() {
         htmlInput.onWorkspaceChangeWrapper_);
 
     // Animation of disposal
-    htmlInput.style.fontSize = Blockly.FieldTextInput.FONTSIZE_INITIAL + 'pt';
+    htmlInput.style.fontSize = Blockly.BlockSvg.FIELD_TEXTINPUT_FONTSIZE_INITIAL + 'pt';
     div.style.boxShadow = '';
-    div.style.width = Blockly.BlockSvg.FIELD_WIDTH + 'px';
-    div.style.height = Blockly.BlockSvg.FIELD_HEIGHT + 'px';
+    // Resize to actual size of final source block.
+    if (thisField.sourceBlock_) {
+      var size = thisField.sourceBlock_.getHeightWidth();
+      div.style.width = (size.width + 1) + 'px';
+      div.style.height = (size.height + 1) + 'px';
+    }
     div.style.marginLeft = 0;
   };
 };