Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa noite pessoa, eu estou desenvolvendo a estrutura do meu portfólio e estou tendo problemas com relação ao zoom na página, a principio eu resolvi fazer todo o site utilizando medidas em porcentagem (não sou muito experiente com html ou css e não sei qual é a maneira correta) mas quando eu dava zoom os textos e tabelas simplesmente saiam de suas divs e ficava tudo bagunçado, percebi que apenas as imagens não saiam de seus devidos lugares... enfim dei uma lida em alguns posts pela internet e descobri que poderia acabar com este problema criando uma Div que cobria todo o site com suas medidas em pixels e depois poderia fazer documentos CSS para as diversas resoluções usadas hoje em dia para não ter problemas com a resolução do site, enfim, ao colocar esta Div que cobre todo o site o problema ao dar zoom foi resolvido, contudo apareceu um outro problema que é ao diminuir o zoom, meu site simplesmente encolhe e se torna pequeno a ponto de caber no canto superior da tela.
Gostaria de saber como resolver este problema, e também se a medida que tomei de criar uma Div que cobre todo o site em pixels é a maneira correta de se lidar com esse problema do zoom.
OBS: segue foto do problema ao tirar o zoom e o código da Div que cobre o site:
#site{
background-color:;
position:absolute;
height:768px;
width:1368px;
}
@Vilson J. Santos antes encontrar a solução ao seu problema, responda: por qual motivo alguém daria "zoom out extremo" no seu site?
@Iskandar usar apenas percentual é layout fluído, ou seja, o layout flui conforme a resolução. Layout responsivo é "responder" a diferentes resoluções.
Bom dia amigo, creio que você quer deixa-lo responsivo certo ? então entre neste site e veja sobre media queries https://developer.mozilla.org/pt-BR/docs/Web/Guide/CSS/CSS_Media_queries para cada layout você poderá definir uma posição para a sua estrutura.
Abraços.
>
16 horas atrás, Gabriel Heming disse:
@Vilson J. Santos antes encontrar a solução ao seu problema, responda: por qual motivo alguém daria "zoom out extremo" no seu site?
@Iskandar usar apenas percentual é layout fluído, ou seja, o layout flui conforme a resolução. Layout responsivo é "responder" a diferentes resoluções.
Eu realmente não tenho ideia do porquê de alguém dar zoom no meu site, porém eu sai pela net dando zoom em todos os sites que eu encontrava e percebi que a grande maioria não fica todo bagunçado com o zoom e gostaria de entender como fazer para que o meu também não fique, meu principal problema é que todo o texto que escrevo no html saem de suas respectivas divs quando dou zoom (isto usando todas as medidas em %), dei uma pesquisada e o que consegui fazer foi incluir a div geral que cobre todo o site em pixel e todo o restante em % para que se adapte à ela e neste caso farei com que esta div geral se adapte de acordo com a resolução do monitor do usuário usando media queries, acho que consegui resolver o problema mas sofri bastante
>
16 minutos atrás, Vilson J. Santos disse:
Eu realmente não tenho ideia do porquê de alguém dar zoom no meu site, porém eu sai pela net dando zoom em todos os sites que eu encontrava e percebi que a grande maioria não fica todo bagunçado com o zoom e gostaria de entender como fazer para que o meu também não fique, meu principal problema é que todo o texto que escrevo no html saem de suas respectivas divs quando dou zoom (isto usando todas as medidas em %), dei uma pesquisada e o que consegui fazer foi incluir a div geral que cobre todo o site em pixel e todo o restante em % para que se adapte à ela e neste caso farei com que esta div geral se adapte de acordo com a resolução do monitor do usuário usando media queries, acho que consegui resolver o problema mas sofri bastante
Use um padrão, tente usar % para div's, e "em" para font's. E para seu site não ficar da forma que esta na imagem, ex: voce deu zoom e ele ficou colado a ESQUERDA. Para resolver isso basta clicar uma DIV global onde ela irar ter uma medida padrão em PX.
Ex: Abaixo
<head>
div.container{width: 1024px; height: 0 auto; margin: 0 auto;}
</head>
<body>
<div class="container">
<p> Todo conteudo do Site </p>
</div>
</body>
Assim oque tiver dentro da div ao dar ou remover zoom o site ira continuar centralizado na tela.
É como eu disse num outro post. Responsividade... pare de trabalhar com a unidade de medida 'px' e utilize 'em' ou '%' em vez.