Como configurar HTML para todos os navegadores e resoluções? - Techtudo-Forum
Bom dia Galera! Estou com um problema de alto nível, eu desenvolvi uma pagina web usando html,css e javascript, no meu navegador que eu trabalho, o google chrome, o site aparece bonitinho com as resoluções corretas, agora quando eu acesso o site pelo firefox e internet explorer a resoluções fica tudo desconfigurada, as imagens ficam em baixo, algumas nem aparece, os menus ficam desconfigurado etc. E agora o que fazer?
Obs.: Estou utilizando a unidade de medida em porcentagem em tudo e minha solução para os navegadores eu consegui utilizando document.getElementById("").style... para sobrescrever todos os elementos do css caso o usuário entre em um navegador diferente. Mas o meu questionamento é em relação a resolução pois eu 1024 X 768, agora tem pessoas que usam 800 X 600 e outras, então o site ficará todo desconfigurado... e agora o que fazer?
javascript resoluções html pagina navegador configuração css
perguntou Feb 09 '12 às 11:35
editou Feb 09 '12 às 19:02
É possível fazer um layout para quase todas as resoluções só com CSS na questão navegador as vezes não é possível agradar a gregos e troianos por isso você pode exibir uma mensagem mostrando qual seria o navegador mais aconselhado, uma largura ideal para uma página web é algo entre 860px e 1024px na questão elementos desalinhados mal posicionados você deve rever os atributos como float, width, margin e position sem código da página não posso ajudar em nada =]
se tiver mais alguma dúvida relacionada ao CSS você poderá encontrar nos sites abaixo:
respondeu Feb 09 '12 às 12:58
Existe esse Site http://validator.w3.org/ Ele verifica o Site a Aponta os Erros que podem estar acontecendo...
Teste ai ... Se não der volte a Perguntar...
respondeu Feb 09 '12 às 14:47
Muito Obrigado raposa e Schultz!
Gostei deste strong textvalidatorstrong text, mas essa está dando um indecifrável pra mim, esse um aqui:" Bad value 50% for attribute width on element img: Expected a digit but saw % instead", o que será que acontece?
Qual a unidade de medida vocês utilizam para fazer site?
Outra coisa que achei um absurdo que eu coloquei o site no servidor 000webhost.com para teste e ele sumiu com a imagem de plano de fundo.
Obs.: 1) O endereço do site é: http://xododaserra.comli.com/ 2) Sou apenas um aprendiz tanto que na faculdade ainda não cursei essa matéria.
respondeu Feb 09 '12 às 16:18
Amigo, Criar um Site TOTALMENTE do 0 è complicado ... Tive uma idéia que pode ser útil... faça um blogspot com o mesmo nome do Site... PEsquise um Template bem bacana na Net ... Com os seus conhecimentos básicos vc consegue editar Totalmente o Template ,,, dentro do blogger, vc ainda pode comprar um dominio qualquer como ; .com ; .com.br etc qualquer um..
Então você pode Editar o Seu Site, Com a TEcnologia Blogger... Entendeu ?
VocÊ vai ter Suporte pronto para Adwords (se vc quiser fazer um anuncio do seu camping na Net)Pode ter um grande retorno...
foi só uma idéia que eu tive para o seu empreendimneto... acho que pode ser a melhor opção para o seu caso...
Schultz (Feb 09 '12 às 17:11)
Muito Obrigado Schultz e raposa, seus conselhos ajudaram muito para minha decisão!
respondeu Feb 10 '12 às 15:42
Host gratuitas são assim mesmo apagam sem o menor aviso =|
cara começa a "brincar" ai com páginas no seu PC mesmo, instala o EasyPHP ou um similar vai lendo tutoriais, livros e por ai vai, crie um blogger e edite pelo código eu comecei assim.
respondeu Feb 09 '12 às 16:51
Os navegadores processam espaçamentos, margens, paddings e outras medidas de forma diferente. Geralmente pode variar justamente uma medida que você não definiu no CSS, e por isso cada navegador tenta resolver por si só o que fazer. Se você quer descobrir o que se passa com seu site em um navegador que não vai com a sua cara, tem algumas coisas que você pode fazer para descobrir o que há de errado:
Coloque uma borda tracejada nos elementos do layout. Aquela coluna que foi parar nas Cucuias, ponha uma borda do tipo {border:dashed 1px #f00;} e atualize a página para ver exatamente onde o navegador colocou o elemento. Mas faça isso em vários elementos, colocando cores diferentes nas bordas. Ao ver algumas coisas demarcadas na página fica mais fácil entender como o navegador está raciocinando.
Use o painel de ferramentas para desenvolvedores do seu navegador. Todos têm um. No Internet Explorer, você acessa com a tecla F12. Vai aparecer um painel na parte debaixo da tela. Você pode inspecionar qualquer elemento, apesar de ser um pouco chatinho no IE. Tem uma ferramenta no painel com a imagem de uma seta, igual à do mouse. Clique nela e em seguida clique na área que está com problema na página. Você verá o código HTML realçado no painel e muitas informações.
Depois disso, abra a página em outro navegador e faça o mesmo para comparar as informações. Nos outros navegadores, geralmente basta clicar com o botão direito do mouse na área que quiser e selecionar a opção Inspecionar Elemento. Dá inclusive para alterar o código-fonte direto no painel para testar alterações e possíveis correções, sem ter de voltar ao programa de edição e salvar o arquivo novamente.
Sobre unidades de medidas, eu uso pixels para definir o layout, mas os tamanhos de fontes podem ser determinados em pontos, pixels, em, porcentagem. A principal diferença é que algumas unidades são relativas, e por isso podem variar de tamanho dependendo do contexto. O mais importante é que você escolha um padrão para utilizar e o mantenha em todo o projeto, pra não ficar perdido tentando converter unidades diferentes.