HTML要素が重複しています

ログインページを作成しようとしています。問題は、コピーを保存するチェックボックスと送信ボタンが重複しているページを最小化しようとするときです。私はCSSで何かを変更する必要があると仮定しています。しかし、私は正確に何がわからない。 https://jsfiddle.net/talamusiclover/ctqgkxcw/HTML要素が重複しています

<!DOCTYPE> 
 
    <html ng-app="myApp"> 
 
    
 
    \t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    \t <link rel="stylesheet" type="text/css" href="C:\Users\etashah\Desktop\email.css"> 
 
    
 
    <div class="container" > 
 
    <div class="row"> 
 
     <div class="col-md-4"></div> 
 
    <div class="col-md-4"> 
 
     \t <form name="myForm" ng-controller="emailController"> 
 
       <div class="form-group1" > 
 
       <label for="exampleInputEmail1">Contacts</label> 
 
       <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email" ng-model="email.text" > 
 
       </div> 
 
       <div role="alert"> 
 
        <span class="error alert" ng-show="myForm.$error.required"> 
 
        Required!</span> 
 
        <span class="error alert" ng-show="myForm.$error.email"> 
 
        Not valid email!</span> 
 
       </div> 
 
    
 
      <div class="form-group2"> 
 
      <label for="subject">Subject</label> 
 
      <input type="text" class="form-control" id="subject" placeholder="Subject"> 
 
      </div> 
 
      <div class="form-group3"> 
 
      <label for="message">Message</label> 
 
      <textarea class="form-control" id="message"></textarea> 
 
      </div> 
 
      <div class="blueBox"> 
 
       <div class="form-group"> 
 
       <div class="col-sm-offset-8 col-sm-10"> 
 
        <div class="checkbox"> 
 
        <label class="checkboxLable"><input type="checkbox">Save a copy</label> 
 
        </div> 
 
       </div> 
 
       </div> 
 
       <div class= "button"> 
 
       <div class="col-sm-u-8 col-sm-10"> 
 
        <button type="button" class="btn btn-primary">Send</button> 
 
       </div> 
 
       </div> 
 
       <div style="clear: both;"></div> 
 
      </div> 
 
     </form> 
 
    </div> 
 
      <div class="col-md-4"></div> 
 
     </div> 
 
    
 
     <br><br><br> 
 
    </div> 
 
     <script src= "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0-rc.2/angular.min.js"> </script> 
 
     <script src= "C:\Users\etashah\Desktop\email\controller.js"> </script> 
 
    
 
    
 
    </body> 
 
    </html>

出典

2017-05-23 user8050674

あなたは右側にあるチェックボックスを保つためにpull-rightクラスを使用することができます：ここにリンクがあります。それはそれです。

出典

2017-05-23 00:09:57

の位置を削除します。あなたのボタンのCSSからが、その後、ボタンのあなたのCSSは次のとおりです。

.button { 
color: #4CAF50; 
font-size: 25px; 
border-radius: 30px; 
color: black; 
right: 10px; 
bottom: 30px; 
}

問題はfile.YouがBootstrapここでブートストラップの詳細を読むことができ、あなたのCSSでそれらを上書きしながら、あなたのHTMLコードは、ブートストラップグリッドシステムを使用したこと、です

出典

2017-05-23 00:44:36

HTML要素が重複しています

答えて

関連する問題