[ Ajuda ] Compatibilidade Com Monitores

[Michael]

Olá galera, estou desenvolvendo um template porem estou tendo um problema na compatibilidade de monitores

no meu computador fica perfeito porem no notbook já fica muito para a direita os subtitulos do menu desalinhado

o site é http://scriptmarketing.com.br/ aqui esta normal mais quando eu entro em um computador com a resolução mais

baixa do que a do meu computador fica desalinhado, se alguém puder me ajudar com isso agradeço muito (:

[FFF]

Boa noite Michael.

Te aconselharia a utilizar o resolution test, no chrome.

Minha resolução é 1920 x 1034, e o site ficou mais alinhado na esquerda.

Cara, da uma revisada nesse teu CSS, tem muita coisa "errada".

Começa arrumando teu "header", tira fora aquele float left, e coloca um margin: 0 auto;

Isso vai centralizar teu DIV na tela.

Depois em #header h1, no padding, pode colocar em 0, aquele 215.

Começa por aí, e vai fazendo, porque na boa, ta feião.

qualquer coisa me manda MP, que eu te ajudo se precisar.

[Michael]

Boa noite Michael.

Te aconselharia a utilizar o resolution test, no chrome.

Minha resolução é 1920 x 1034, e o site ficou mais alinhado na esquerda.

Cara, da uma revisada nesse teu CSS, tem muita coisa "errada".

Começa arrumando teu "header", tira fora aquele float left, e coloca um margin: 0 auto;

Isso vai centralizar teu DIV na tela.

Depois em #header h1, no padding, pode colocar em 0, aquele 215.

Começa por aí, e vai fazendo, porque na boa, ta feião.

qualquer coisa me manda MP, que eu te ajudo se precisar.

vou fazer oque você falo, é primeira vez que mecho com css :P

obrigado por ajudar.

[joaopaulo]

Use algum grid pronto. Tem o 1Kb Grid System que é excelente e só pesa 1kb.

[VTFerreira]

Michael, visitei seu site e realmente está com problemas. Pessoalmente eu sempre testo meus sites no IE 9, Firefox, Chrome e Opera. Não sabemos qual navegador irá visitar o nosso site, assim é bom ver o que acontece nos principais programas. Já me disseram que eu deveria testar também no Safari, mas não muda muito em relação aos outros... ;)

No seu site, o título dos links (tag H1 - Produtos e Serviços, Sobre Nós, etc ) está desalinhado dos respectivos conteúdos e:

• No Internet Explorer 9, ao modificar a resolução da tela, mudar o zoom ou o tamanho da janela, a tag H1 "anda pelo site". Se a janela for muito reduzida os elementos do seu site irão se posicionar uns sobre os outros ao invés de surgir uma barra de rolagem horizontal. As imagens dos logos também se posicionam sobre o texto, ao invés de surgir a barra de rolagem vertical.
  
• No Firefox, Chrome e Opera não vi o problema do zoom, mas vi todos os outros.
  

Na dúvida, procure um(a) webdesigner ou visite http://www.w3.org/ B)

[sanpol]

vc colocou float left e definiu um padding left pra ficar centralizado de acordo com sua resolução, assim nao funciona em outras resoluções.

o que vc deve fazer é definir a largura de cada div e centraliza-las com margin: 0 auto;

[Michael]

consegui arrumar depois que eu termina posto resultado, obrigado a todos

solução:

#body{

width: 1000px;

margin:0 auto;

}

<ul id="menu">

<li><a href="#"><span>HOME</span><em>PÁGINA INICIAL</em></a></li>

<li><a href="#"><span>MARKETING DEDICADO</span><em>OS MELHORES PREÇOS & SERVIDORES</em></a></li>

<li><a href="#"><span>VPS MARKETING</span><em>MARKETING SEMI DEDICADO</em></a></li>

<li><a href="#"><span>SERVIÇOS</span><em>SEO & MARKETING</em></a></li>

<li><a href="#"><span>TUTORIAIS</span><em>BASE DE CONHECIMENTO</em></a></li>

<li><a href="#"><span>EMPRESA</span><em>CONHEÇA A EMPRESA</em></a></li>

<li><a href="#"><span>CONTATO</span><em>TIRE SUAS DUVIDAS</em></a></li>

</ul>

#menu{ list-style:none;}

#menu li{float:left;}

#menu li a{

display:block;

float:left;

padding:0 15px;

color:#036;

text-decoration:none;

font-size:12px;

font-weight:font-weight;

}

#menu li a span{display:block;}

#menu li a em{display:block; font-size:9px; color:#E3E3E3}