Na minha página HTML eu criei um sidebar e ao lado uma <div>
que irá guardar uma <ul>
.
Antes de adicionar essa <ul>
, a página estava do jeito que eu queria, sem nenhum espaço em cima da sidebar
e do conteúdo lateral. Porém ao adicioná-la à <div>
, ficou um espaço vazio em cima da página como se existisse uma margem lá, sendo que aparentemente não existe.
Abaixo está o meu código:
#sidebar {
background-color: rgb(11, 22, 34);
border: 2px solid #000;
height: 100vh;
margin: 0;
overflow: auto;
padding: 0px;
position: fixed;
text-align: center;
width: 240px;
}
#user_image {
background-color: #000;
border: 2px solid #000;
cursor: pointer;
height: 200px;
margin-top: 20px;
width: 200px;
}
#list {
height: 100vh;
margin-left: 240px;
width: 800px;
}
body {
background-color: rgb(11, 22, 34);
margin: 0;
}
<div id="sidebar">
<img id="user_image" onclick="chooseUserImage();"/>
<input id="file_input" type="file" hidden="false"/>
</div>
<div id="list">
<ul></ul>
</div>
O que está acontecendo? Como posso retirar esse espaço vazio que ficou em cima da página?