2016-07-16 7 views
2

私は現在、私の上級卒業論文のウェブサイトを始めています(最初から始めています)。私はhtmlの構造としてflexboxを使用していますが、flexboxのデフォルトのマージンやページを削除する方法は不思議でした。フレックスボックスのデフォルトのパディング/マージン/ページマージンを削除するには?

HTMLボディ

<header> 
    <section> 
     <!--Start of Logo--> 
     <div class="logo_section">People Tracking System</div> 
     <!--End of Logo--> 

     <!--Start of Time--> 
     <div class="time_section"> 
      <br><br> 
      <div id = "time" ></div> 
      UCT+8 
     </div> 
     <!--End of Time--> 

     <!--Start of Login Form--> 
     <div class="login_section"> 
      <form action="login.php" class = "container" method="POST"> 
       <div class="container">  
        <label>login: </label> &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
        <input id = "inputform" type="text" placeholder="Enter Username" name="uname" required> 
        <br> 
        <label style="text-align:right">password: </label>&nbsp; 
        <input id = "inputform" type="password" placeholder="Enter Password" name="psw" required> 
        <br> 
        <input type="checkbox" checked="checked"> Remember me 
        <button type="submit" id ="submit">Login</button> 
       </div> 
      </form> 
     </div> 
     <!--end of login form--> 
    </section> 
</header> 

CSSコード

section { 
    display: -webkit-flex; 
    display: flex; 

    -webkit-flex-direction: row; 
    flex-direction: row; 

    -webkit-flex-wrap: wrap; 
    flex-wrap: wrap; 
    margin:0; 
} 

/*Logo Section*/ 
.logo_section { 
    flex: 1 1 10%; 
    order: 1; 
} 

/*time*/ 
.time_section { 
    background: #143c70; 
    flex: 3 1 60%; 
    order: 2; 
    text-align:right; 
    color: white; 
} 

/*login form*/ 
.login_section { 
    background-color: #7098cc; 
    clear: none; 
    flex: 1 6 15%; 
    order: 3; 
} 

https://jsfiddle.net/laklaker/qyghLof4/

は、私はあなたがこの問題についての私を助けることができると思います。ありがとう!

答えて

1

これはjsfiddleで発生している可能性があります。あなたのページにまだそれが起こっている場合、あなたは持っていることができます:

body { 
    margin: 0; 
} 
+0

ありがとうそれは完璧に動作します! – Jonaii

+1

@Jonaii、http://stackoverflow.com/help/someone-answers –

関連する問題