Daí como eu uso 1024x768 meus layouts acabam dando certo pra mim, mas quando redimensiono pra 800x600 dá problema com os paddings e margins.
Então eu corrijo os paddings e margins para o 800x600 e quando volto pra minha resolução, os mesmos se bagunçam novamente.
E eu fico nesse beco sem saída.
Vejam a foto:
Esse é corrigido para 800x600
O correto seria o espaço entre o menu e o conteúdo ser da mesma largura da borda direita dos mesmo (bem fina).
O CSS envolvidos são:
#wrapper { background-color : #ffffff; margin : 0 auto; text-align : left; padding : 3px; vertical-align : top; overflow : hidden; height: 100%; } #main { float : right; margin : 5px 6px 5px 0px; _margin : 5px 3px 5px 0px; padding : 7px 5px 5px 10px; vertical-align : top; width : 72%; } /* Menu */ #menu { float : left; padding-right: 5px; width : 24%; } #menu .title { background-color : #3B4041; font-size:10px; vertical-align:middle; _vertical-align: top; font-weight:bold; color:#FFF; height: 12px; padding: 6px; overflow: hidden; } #menu .block { font-size:9px; font-family: Verdana, Arial, Helvetica, sans-serif; padding:2px 0px 2px 0px; } #menu .content { background-color:#FFFFFF; padding:2px 0px 2px 7px; }Referentes ao menu, o corpo e o "invólucro" principal.
Para corrigir meu problema para 1024x768 basta eu alterar o width: 72% de #main para 73%. Mas como teu problemas nos paddings ou nos margins ou nos dois) essa alteração corretiva bagunça a outra resolução.
Como poderia resolver?
[]'s