login input great

src/login/LoginInput.js

@@ -83,9 +83,9 @@ class LoginInput extends Component {
 
                     return (
                         <div>
-                            <span style={{marginRight: 20}}><b><FormattedMessage id="register"/>:</b></span>
+                            <span style={{marginRight: 20}} className='login-title'><b><FormattedMessage id="register"/>:</b></span>
                             <div style={{marginTop: 10}}>
-                                <span><FormattedMessage id="username"/>: </span>
+                                <span className='login-item'><FormattedMessage id="username"/>: </span>
                                 <Input
                                     placeholder=""
                                     onChange={(e) => {
@@ -104,7 +104,7 @@ class LoginInput extends Component {
                                 }
                             </div>
                             <div style={{marginTop: 10}}>
-                                <span><FormattedMessage id="password"/>: </span>
+                                <span className='login-item'><FormattedMessage id="password"/>: </span>
                                 <Input
                                     placeholder=""
                                     onChange={(e) => {
@@ -115,7 +115,7 @@ class LoginInput extends Component {
                                 />
                             </div>
                             <div style={{marginTop: 10}}>
-                                <span><FormattedMessage id="nickname"/>: </span>
+                                <span className='login-item'><FormattedMessage id="nickname"/>: </span>
                                 <Input
                                     placeholder=""
                                     onChange={(e) => {
@@ -220,9 +220,9 @@ class LoginInput extends Component {
                                 ''
                             :
                             <div>
-                                <span style={{marginRight: 20}}><b><FormattedMessage id="login"/>:</b></span>
+                                <span style={{marginRight: 20}} className='login-title'><b><FormattedMessage id="login"/>:</b></span>
                                 <div style={{marginTop: 10}}>
-                                    <span><FormattedMessage id="username"/>: </span>
+                                    <span className='login-item'><FormattedMessage id="username"/>: </span>
                                     <Input
                                         placeholder=""
                                         onChange={(e) => {
@@ -233,7 +233,7 @@ class LoginInput extends Component {
                                     />
                                 </div>
                                 <div style={{marginTop: 10}}>
-                                    <span><FormattedMessage id="password"/>: </span>
+                                    <span className='login-item'><FormattedMessage id="password"/>: </span>
                                     <Input
                                         placeholder=""
                                         onChange={(e) => {

src/login/index.css

@@ -132,4 +132,13 @@
   box-shadow: 0 1px 10px rgba(26,26,26,.1);
   box-sizing: border-box;
   position: relative;
+}
+
+.login-item {
+  display: inline-block;
+  width: 120px;
+}
+
+.login-title {
+  font-size: 16px;
 }