Merge pull request #601 from creativecommons/stepper-question-clarity

improve stepper question clarity, correct style `label` wrapping bug

Author: possumbilities

src/index.html

@@ -158,7 +158,7 @@ <h1>Choose a License for Your Work</h1>
 
         <li>
         <fieldset id="require-attribution">
-            <legend>Attribution?</legend>
+            <legend>Require attribution for your work?</legend>
 
             <div>
                 <input type="radio" id="yes-attribution" name="attribution" value="yes" />
@@ -176,7 +176,7 @@ <h1>Choose a License for Your Work</h1>
 
         <li>
         <fieldset id="allow-commercial-use">
-            <legend>Commercial Use?</legend>
+            <legend>Allow others to use your work commercially?</legend>
 
             <div>
                 <input type="radio" id="yes-commercial" name="commercial" value="yes" />
@@ -193,7 +193,7 @@ <h1>Choose a License for Your Work</h1>
 
         <li>
         <fieldset id="allow-derivatives">
-            <legend>Derivative Works?</legend>
+            <legend>Allow others to remix, adapt, or build upon your work?</legend>
 
             <div>
                 <input type="radio" id="yes-derivatives" name="derivatives" value="yes" />
@@ -210,7 +210,7 @@ <h1>Choose a License for Your Work</h1>
 
         <li>
         <fieldset id="share-alike">
-            <legend>Sharing Requirements?</legend>
+            <legend>Require adaptions of your work to be licensed under the same CC license?</legend>
 
             <div>
                 <input type="radio" id="yes-sharing-requirements" name="sharing-requirements" value="yes" />

src/style.css

@@ -164,7 +164,6 @@
 }
 
 .chooser-page form#chooser label {
-    display: block;
     font-size: .7em;
     font-weight: 400;
 }
@@ -177,6 +176,10 @@
     line-height: 1.3;
 }
 
+.chooser-page form#chooser #attribution-details label {
+    display: block;
+}
+
 .chooser-page form#chooser #attribution-details div {
     margin-bottom: .5em;
 }