Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoas, estou precisando criar o seguinte.
Uma lista cujos elementos fiquem sempre lado a lado, e caso ultrapassem o tamanho da tela, a barra de rolagem horizontal apareça e o usuário role a barra.
O que consegui até o momento, foi colocando os itens dentro de uma DIV e esta DIV eu coloquei um tamanho fixo.
Gostaria de algo mais flexível, já que a quantidade de elementos pode variar.
tente utilizar
white-space: nowrap;
e
overflow: auto;Olá @Public2004 e @Mr. Whyte, acabei utilizando um carousel para resolver meu problema, mas utilizando apenas CSS, também consegui utilizando o seguinte CSS:
#row{display: flex;}
.item{width: 100%; height: 256px; min-width: 100%;}
.item:nth-child(even){background: #fdf;}
.item:nth-child(odd){background: #dfd;}
O Flex coloca todos um ao lado do outro, porém ele redireciona para que todos caibam na mesma linha, dando um valor mínimo de largura, acaba forçando a utilizar aquela largura do elemento e então é feito um overflow horizontal.
Não sei exatamente como é o seu projeto, pois poderia sugerir que utilizasse um "carousel", em todo caso para o que quer, trabalhe com o "overflow-x".
Att.