I am developing a footer using vuejs along with buefy.
In my implementation of App.vue below, I am encountering a white margin under the footer.
// App.vue
<template>
<div id="app">
<main-header />
<router-view/>
<main-footer />
</div>
</template>
...
<style>
html, body {
height: 100%;
}
body {
padding: 0;
margin: 0;
}
</style>
I am uncertain about the origin of these margins.
How can I resolve this issue?
++++ Please find below the code for the footer that I have implemented:
// Main Footer
<template>
<footer class="footer">
<div class="content has-text-centered">
<p>
<strong>Web</strong>
<br>
© 2020 •
</p>
</div>
</footer>
</template>
<script>
export default {
name: "MainFooter",
}
</script>
<style scoped>
footer {
margin: 0;
}
</style>