Menu
I'm trying to apply background-color property to my Vue.js application. Since I want it to be displayed on all pages, I'm applying CSS directly to tag in index.html:
<head>
<style>
body, html {
padding: 0;
margin: 0;
width: 100%;
}
body {
background-color: black;
}
</style>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
So, as I see through the inspector, html doesn't cover the whole page
How to apply background-color to the whole page?
355
This seems to be working:
<head>
<style>
body, html {
padding: 0;
margin: 0;
width: 100%;
min-height: 100vh;
}
body {
background-color: black;
}
</style>
</head>
<body>
<div id="app">
</div>
<!-- built files will be auto injected -->
</body>
Here the Codepen
114
CSS rule is not applied because you didn't specified the height, but only the width.
body, html {
padding: 0;
margin: 0;
width: 100%;
min-height: 100%; // add this rule
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
