Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

[Bug] Zoom de 25% em todo o projeto

Depois de terminado, o meu projeto bugou e agora tem um zoom de 25% nele todo, o que só dá para resolver apertando 'Ctrl -' 3 vezes. Isso começou depois que eu criei um novo file para colocar a imagem de um dos meus certificados de curso para por na aba "Currículo" e linkar ela, mas depois que eu a abri, a qualidade do certificado estava muito alta, então tive que dar 'Ctrl -' 3 vezes para vê-lo inteiro na tela. Quando voltei pra tela "Currículo", tudo estava 25% maior. O código não mudou, e eu já apaguei tudo relacionado a essa aba do certificado, mas nada voltou ao normal. Socorro!!!!!!

Como está: print do meu projeto bugado

Como deveria ser: print 2

Se quiserem conferir os códigos me avisem que eu coloco nos comentários.

5 respostas

Olá Mariana, tudo bem?

Pelo que entendi, o seu projeto está com um zoom de 25% em todo o código e você só consegue resolver isso dando 'Ctrl -' 3 vezes, certo?

Parece que o problema começou depois que você adicionou um novo arquivo para colocar a imagem de um dos seus certificados de curso, é isso mesmo? E quando você abriu a imagem, precisou dar 'Ctrl +' 3 vezes para ver a imagem inteira na tela, é isso?

Bom, pelo que entendi, o problema pode estar relacionado ao fato de você ter dado zoom na imagem do certificado, o que acabou afetando o zoom do projeto todo. Tente mudar o tamanho da imagem para que ela se ajuste ao tamanho da tela, algo como um max-width: 100%; ou max-width: 10vw ou propriedades usando unidades relativas como em, rem, vh, % vw, dentre outras.

Outra solução seria usar @media queries para adaptar o seu projeto para outros tamanhos de tela. Caso você precise de ajuda para isso você pode estar colocando o seu projeto no ar no Github, na Vercel, Code Pen ou em outras plataformas com essa mesma função para que eu possa analisar o projeto e tentar lhe ajudar.

Espero ter ajudado, caso precise de mais algo estarei aqui. Um abraço e bons estudos!

Eu não consegui resolver com nenhuma das sugestões que você me deu... Se puder dar uma olhadinha no código, ele está aqui: https://github.com/mareeeana/bug

Olá Mariana, tudo bem contigo?

Eu primeiramente peço desculpas por não poder lhe ajudar de prontidão, mas o link que você me mandou está me levando para uma página de erro, ou seja, que o link está gerando um erro HTTP 404, veja a captura de tela que o link da mensagem acima leva:

Tela do github mostrando erro HTTP 404, onde existe uma ilustração e uma mensagem dizendo o link não leva à uma webpage válida com algumas partes censuradas e uma seta indicando que foi usando o mesmo endereço http do post no fórum

Como você pode ver o link não está levando até uma página válida então não tem como eu estar lhe ajudando.

Eu até tentei encontrar o seu perfil no Github, mas como você pode ver na captura de tela abaixo lá não tem nenhum repositório, publico:

Registro de tela do perfil da aluna mostrando que ela não tem nenhum repositório publico para acesso Então eu irei pedir que você tente exportar o projeto para o Github de outra forma, ou se o projeto já estiver lá eu peço que me libere o acesso.7

Outra coisa que é de suma importância para mim também é que você tente me explicar com mais detalhes o que eu devo observar em seu projeto quando você liberar ele, ou seja, o que você gostaria que eu fizesse nele para lhe auxiliar da melhor forma para resolver o problema em seu projeto.

Em suma seria isso.

Aguardo seu retorno e bons estudos!

Peço desculpas, eu tinha deixado ele privado sem querer, mas já abri: https://github.com/mareeeana/bug

Eu queria saber o que está fazendo a minha página ficar com um zoom de 25%, e caso não tenha nada de errado no código pra isso estar acontecendo, eu queria algum jeito de resolver isso com mais comandos. Eu não queria ter que refazer o projeto do 0, mas eu já tentei tudo que eu sei, até copiei o código e criei outro arquivo com ele pra ver se era um bug daquela página, mas o problema permaneceu mesmo no novo arquivo, o que indica que o erro está mesmo no próprio código.

(Dentro do arquivo curriculo.html tem uma tag que não está ancorada em link nenhum, eu sei disso, estou trabalhando em um jeito de transformar o arquivo do meu certificado em link para linkar lá, então caso perceba isso pode ignorar. :) )

Desde já agradeço a prontidão para me ajudar e peço desculpa pelo inconveniente!

solução!

Olá Mariana, tudo bem contigo?

Bom primeiramente o que aconteceu aqui no seu projeto foi o seguinte:

  • Primeiro você programou todo o site em um tamanho de 75% de Zoom na tela, e quando terminou a aplicação percebeu a questão do zoom, pois provavelmente o navegador retornou ao tamanho de zoom original, que é algo totalmente natural e você ficou preocupada que o projeto estivesse quebrado, mas não se preocupe, isso é tudo uma questão de responsividade.
  • Você provavelmente ainda não deve ter concluído a formação, mas se você avançar mais um pouco você vai perceber que no último curso da formação os instrutores vão apresentar o conceito de responsividade e ajudar os alunos à tornar esse portfólio responsivo:
  • Nesse curso você provavelmente iria entender o que eu vou mostrar agora, mas vamos lá:

Bom como você disse que precisava de ajuda com o projeto, então o que eu fiz foi baixar o seu projeto e montar um documento de estilo novo que foi referenciado somente no documento curriculo.html, pois se eu colocasse aqueles estilos no documento style.css os estilos seriam aplicados para todas as páginas html do seu projeto, o que iria quebrar a aplicação, portanto peço que você mantenha assim.

Eu vou deixar um link do drive com os arquivos prontos para uso, então se você quiser use eles, pois eu fiz umas alterações mínimas no documento curriculo.html para aplicar os estilos css responsivo.

Eu vou deixar o link para você acessar os arquivos e baixar eles(O arquivo que contém a responsividade está com o nome curriculo-styles e está na pasta de styles, **e lembre-se que quando e se você baixar os arquivos eles podem estar zipados então antes de tentar abrir eles lembre-se de extrair eles para o seu computador, do contrário eles estarão quebrados):

Em suma seria isso, caso você precise de mais algo é só me falar que estarei aqui para lhe ajudar com o que eu puder.

Abraços e bons estudos.

Caso este post tenha lhe ajudado, por favor marque ele como solução! ✓