Problema com Divs sobrepostos

Um usuário perguntou ?

Olá a todos

Estou tendo o problema que não posso clicar no menu da categoria à esquerda quando vejo a página do produto apenas para celular. Os links na caixa da categoria funcionam em todas as outras páginas e funcionam na página do produto no desktop, mas não no celular.

Aqui está um exemplo: https://autoelecoz.com.au/product/dry-bag/

Suspeito que uma div sobreposta esteja afetando a legibilidade?

Se alguém pudesse dar uma ideia que seria ótimo, obrigado.

Sam

(@ashwinparthasarathi)

10 meses, 3 semanas atrás

Olá @samd2020,

Eu recebi o seu problema e, como você mencionou, é tudo sobreposição de divs.

Especificamente, estas são as classes bootstrap adicionadas à barra lateral e ao conteúdo principal da div.

as classes atuais são, para “barra lateral”” – barra lateral col-xs-12 col-sm-4 col-md-3 para “div (conteúdo principal)” – col-sm-8 col-md-9

o problema: o div de conteúdo principal se sobrepõe porque não há classe col-xs-*.

a solução, alterar as classes até agora, para a barra lateral “lateral (barra lateral)” – col-xs-12 col-sm-12 col-md-3 para o “div (conteúdo principal)” – col-xs-12 col-sm-12 col-md-9

Também adicionei uma alteração nas classes sm, pois não há possibilidade de as colunas 4:8 funcionarem na faixa do dispositivo “sm”.

Além disso, veja https://developers.google.com/web/tools/chrome-devtools/remote-debugging sobre como depurar o navegador Chrome em dispositivos móveis.

(@kartiks16)

10 meses, 3 semanas atrás

Olá samd2020,

Adicionando ao que Ashwin sugeriu, encontrei o problema com as classes CSS e atribuí a Posição.

Tente o que Ashwin sugeriu e nos avise se isso ajudar.

Obrigado.

(@samd2020)

10 meses, 3 semanas atrás

Obrigado a ambos pelo grande trabalho.

Nessa página, há uma maneira de a) exibir a caixa de categoria primeiro? e b) ocultar as caixas ‘transporte do mesmo dia’ e ‘revendedor redarc’ em um celular apenas na página do produto? Tentei mostrar: nenhuma para as seções @media, mas foi removida da página inicial e outras páginas, bem como da página do produto.

Obrigado novamente,

Sam

(@ashwinparthasarathi)

10 meses, 3 semanas atrás

Olá @samd2020,

Tente adicionar uma classe de página específica ao seu seletor CSS, algo como,
body.single-product .woo-cat-list { display:none; }

Isso garantirá que as propriedades CSS só se apliquem à página onde a classe CSS está disponível.

(@samd2020)

10 meses, 3 semanas atrás

Obrigado Ashwin.

Adicionei a linha .single-product .woo-cat-list {display: nenhum;} (com a palavra corpo na frente que não funcionou) com estilo.css sob uma tela @media e (largura máxima: 420px)

ele os esconde quando olho para eles no console de depuração do Firefox depois de adicionar isso, mas no Google Chrome ou no meu próprio iPhone, ainda posso vê-los?

Esta resposta foi modificada há 10 meses, há 3 semanas.

(@ashwinparthasarathi)

10 meses, 3 semanas atrás

Se isso ocultar itens no Firefox e você ainda puder visualizá-los no Chrome ou no seu iPhone, seria principalmente cache.

Tente verificar a localização na janela anônima/privada para confirmar se o problema está corrigido para caixas de Chrome e iPhone.

(@samd2020)

10 meses, 3 semanas atrás

ainda não está presente no modo incógnito ?

(@samd2020)

10 meses, 3 semanas atrás

Ele realmente funciona no modo de navegação anônima no meu iPhone, mas não no navegador de desktop Chrome anônimo. Então acho que funciona?

Obrigado, mais uma vez, por toda sua ajuda!

(@ashwinparthasarathi)

10 meses, 3 semanas atrás

Também acho que significa que a questão está resolvida.

Adoraríamos que você marcasse esta questão como uma solução. Isso ajuda nossos voluntários a encontrar os problemas que precisam de atenção e obter mais ajuda de pessoas, talvez como você fez.

(@samd2020)

10 meses, 3 semanas atrás

obrigado

Resolveu seu problema?

0/0

Isto foi útil?

0 / 0

Deixe uma resposta 0

O seu endereço de email não será publicado. Campos obrigatórios são marcados *