From 9acab86871b51fefd00887f5d37abc18c2d2daee Mon Sep 17 00:00:00 2001
From: Paul Gschwendtner <paulgschwendtner@gmail.com>
Date: Fri, 1 Sep 2017 16:57:46 +0200
Subject: [PATCH] fix(checkbox): label content should not wrap (#6674)

* Similar as for the radio component, the checkbox label content should not wrap if it exceeds the boundaries of the parent element. This ensures that we have consistent behavior across all selection controls.
* Fixes that the radio container (circle) shrinks if the label content is exceeding the boundaries and wrapping is enabled (developers may overwrite CSS to enable wrapping)

Closes #6671
---
 src/lib/checkbox/checkbox.scss | 1 +
 src/lib/radio/radio.scss       | 5 ++++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/lib/checkbox/checkbox.scss b/src/lib/checkbox/checkbox.scss
index 57752e0ea812..c591b1be75fe 100644
--- a/src/lib/checkbox/checkbox.scss
+++ b/src/lib/checkbox/checkbox.scss
@@ -193,6 +193,7 @@ $_mat-checkbox-mark-stroke-size: 2 / 15 * $mat-checkbox-size !default;
   align-items: baseline;
   vertical-align: middle;
   display: inline-flex;
+  white-space: nowrap;
 }
 
 .mat-checkbox-inner-container {
diff --git a/src/lib/radio/radio.scss b/src/lib/radio/radio.scss
index cffb3b237ce7..9ccd2b679c57 100644
--- a/src/lib/radio/radio.scss
+++ b/src/lib/radio/radio.scss
@@ -24,9 +24,12 @@ $mat-radio-ripple-size: $mat-radio-size * 0.75;
 .mat-radio-container {
   box-sizing: border-box;
   display: inline-block;
-  height: $mat-radio-size;
   position: relative;
   width: $mat-radio-size;
+  height: $mat-radio-size;
+  // The radio container is inside of a inline-flex element and may shrink if the label
+  // is wide and text-wrapping is enabled.
+  flex-shrink: 0;
 }
 
 // The outer circle for the radio, always present.