Tenho um HTML dizendo que o scrollbar terá 8px, assim:
::-webkit-scrollbar {
width: 8px;
}
Nesse HTML tera uma galeria de imagem, onde cada foto ocupará 20% da largura do body, então fiz assim:
.foto_galeria{
width: 20vw;
float: left;
}
E aí que acabo tendo problemas, quando checo o tamanho do meu body
vejo que ele tem 1912px, e quando vou checar o tamanho da DIV foto_galeria, ela ta com 480px, e 480 X 4 = 1920 e não 1912, então ele está levando em consideração o tamanho do scrollbar, como solucionar isso?
Pois da forma que está, a DIV foto_galeria quebra, não fica uma ao lado da outra. Ela fica apenas em 4 colunas, pois não cabe 5 no body.
Segue o código completo:
::-webkit-scrollbar {
width: 8px;
background-color: $marrom;
}
.foto_galeria{
width: calc(20vw - 2px);
height: calc(20vw - 2px);
float: left;
border: solid 1px #000000;
}
<body>
<div class="foto_galeria">1</div>
<div class="foto_galeria">2</div>
<div class="foto_galeria">3</div>
<div class="foto_galeria">4</div>
<div class="foto_galeria">5</div>
</body>