时间戳

首页 > 解决方案 > 宽度为 100vw 的 Div 不适合屏幕

html - 宽度为 100vw 的 Div 不适合屏幕

问题描述

我有元素<div id="pageFooter">，我想让它全宽（窗口宽度）所以我申请width:100vw了，我不希望它是固定的/绝对的。应用后，结果如下： div（底部的页脚）略微向左移动。 结果0

所以我在网上搜索，我得到了这个 答案。我试图应用这种风格，但它什么也没改变。我该如何解决？

最小的工作示例：（我使用了一点剃须刀，但样式无关紧要。HTML：


    <div class="FooterWrapper lang">
        <footer class="pageFooter">
            <div id="userTools" class="FooterItem">
                <div class="FooterLangSwitcher">
                    <h4>@(Stock_WebApp_v2.Resources.AppCulture.Language)</h4>
                    <hr />
                    @foreach (string value in Stock_WebApp_v2.Resources.LanguagesAvailable.ApplicationLanguages.Split(';'))
                    {
                        <h5 onclick="loc = location.href.split('/');var cul = '@(value.Split(':')[0])';var u = loc[0] + '//' + loc[2] + '/' + cul;for (var x=4;x<loc.length;x++) {u+='/'+loc[x];} window.location.replace(u);">@(value.Split(':')[1])</h5>
                    }
                </div>
            </div>
        </footer>
    </div>

CSS：

.FooterWrapper {
    width: 100vw;
}
.FooterItem {
    color:white;
    margin: 5px 5px 5px 5px;
    padding: 5px 5px 5px 5px;
}
body {
    font-family: Arial, sans-serif;
}

标签： htmlcss

解决方案

加margin 0在身体上

body {
    font-family: Arial, sans-serif;
    margin:0;
}

https://jsfiddle.net/moh78sgd/2/

推荐阅读