TOPO
PRINCIPAL
Esta página é interativa e destina-se a demonstrar as funcionalidades previstas nas especificações CSS3 para Media Queries.
Redimensione a janela do seu navegador em movimentos horizontais de modo a obter largura mínima e máxima. Observe a mudança dinâmica de layout para 3, 2 e 1 coluna dependendo da resolução (largura do navegador).
O layout se acomoda ao tamanho da janela sem necessidade de alterar a marcação HTML.
Examine o código fonte da página (as regras CSS estão incorporadas ao documento) para mais detalhes.
A finalidade desta página é somente demonstrar o funcionamento de Media Queries
Nota: Usamos o script css3-mediaqueries.js nesta página. Assim ela funciona nos IE8 e anteriores que não suportam nativamente Media Queries. Usamos também, propositadamente, múltiplos backgrounds para a técnica faux-columns nos layouts de 2 e 3 colunas, mas como múltiplos backgrounds não funcionam nos IE8 e anteriores as colunas NAV e AUX não têm sua cor estendida até o rodapé como acontece no Firefox.
AUX
Lorem ipsum dolor sit amet.
RODAPÉ