Olá pessoal tudo bem?
estou tendo posicionar os item a esquerda usando o margin-right: auto, mas os itens estão no lado direito da pagina.
se alguém poder me ajudar, ficarei grato
@media screen and (min-width:1366px){
.container__link{
display: flex;
align-items: center;
text-decoration:none;
color:var(--preto);
}
.cabecalho{
padding: 0 2em;
}
.opcoes{
margin-right:auto;
}
}
html
<div class="container" >
<ul class="opcoes"><!-- Responsividade versao 1024px-->
<input type="checkbox" id="opcoes-menu" class="opcoes__botao">
<label for="opcoes-menu">
<li class="opcoes__item">Categoria</li>
</label>
<ul class="lista-menu">
<li class="lista-menu__item">
<a href="#" class="lista-menu__link">Programação</a>
</li>
<li class="lista-menu__item">
<a href="#" class="lista-menu__link">Font-End</a>
</li>
<li class="lista-menu__item">
<a href="#" class="lista-menu__link">Infraestrutura</a>
</li>
<li class="lista-menu__item">
<a href="#" class="lista-menu__link">Business</a>
</li>
<li class="lista-menu__item">
<a href="#" class="lista-menu__link">Desing & ux </a>
</li>
</ul>
<li class="opcoes__item"><a href="#" class="opcoes__link">favoritos</a></li>
<li class="opcoes__item"><a href="#" class="opcoes__link">Minha estante</a></li>
</ul>
<div class="container">
<a href="#"><img src="assets/Favoritos.svg" alt="Meus favoritos" class="container__imagem container__imagem-trasparente"></a>
<a href="#" class="container__link">
<img src="assets/Sacola.svg" alt="Carrinho de compras" class="container__imagem">
<p class="container__texto">Minha sacola</p><!--resolução 1728px-->
</a>
<a href="#" class="container__link">
<img src="assets/Usuario.svg" alt="meu perfil" class="container__imagem">
<p class="container__texto">Meu perfil</p><!--resolução 1728px-->
</a>
</div>
</div>