javascript - 如何删除 flexbox 默认的 padding/margin/pagemargin?

标签 javascript html css flexbox

我目前正在启动我的高级论文网站(从头开始)。我正在使用 flexbox 作为 html 的结构,但是我想知道如何删除 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/

我希望你能帮助我解决这个问题。谢谢!

最佳答案

我认为这可能发生在 jsfiddle 中。如果它仍在您的页面中发生,您可以:

body {
    margin: 0;
}

关于javascript - 如何删除 flexbox 默认的 padding/margin/pagemargin?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38411555/

相关文章:

javascript - 如何增加mongodb的文档大小(超过16MB)?我

javascript - 如何在无状态函数中使用 ref?

php - 检查 SESSION 变量的值是否属于业务逻辑?

html - Bootstrap 3,导航栏图标位置随着浏览器宽度的变化而变化

html - 如何使用输入类型 ="number"使用 CSS 调整按钮的大小

javascript - 设计 AJAX 应用程序的推荐方法

php "glob"模式帮助

javascript - <html> 比屏幕宽

html - IE9 中的 CSS 相对 href 和 iFrame

javascript - Jquery 拖放验证