nandoseguim23

Olá tenho que entregar este site ate dia 28/06 como projeto de fim de modulo, porém não consigo fazer com que o css seja compativel com os diversos tamanhos de monitores. Tenho feito toda a programação em meu notebook q tem tela no formato 16:8, porem quando tento rodar em monitores com tamanhos diferentes todo o conteúdo fica deseorganiado.

Será que alguém já teve esse probleme e/ou passa me ajudar a resolve-lo?

/*RESET*/
* {margin:0%; padding:0%;}
body {background:#EBF0A3; font:"Trebuchet MS", Arial, Helvetica, sans-serif;}

#box{background:#EBF0A3}

/*MENU*/
#menu {height:30px; background:url(imagem/menu.jpg)}
#menu a {float:left; text-decoration:none; color:#FFF; 
		font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; padding:5px 15px;}
#menu a:hover {background:url(imagem/hover.jpg) repeat-x;}
#menu img{float:left}

/*HEADER*/
#logo {float:left; padding:0px 5px 0px  5px;}

#slogan{font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:24px; font-weight:bold; color:#000;}

#log{float:right; text-decoration:none; color:#FFF;font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; margin:3px 20px 0px 0px;}

#anuncio{float:right;}

#carrinho{float:right;}

/*PESQUISA*/
#pesquisabarra{float:right; background:url(imagem/BarraPesquisa.png); height:40px;}

#pesquisa{float:right; margin:10px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFF;}

/*CONTEUDO*/
#conteudo{background:#FFF; margin:0px 0px 0px 200px; padding:10px; width:870px;}

/*RODAPE*/
#rodape {height:30px; background:url(imagem/rodape.jpg) no-repeat}
#divclear {clear:both;}