soy un neofito con CSS, help me :)

[FitoNitroso]

wenas..

debo decir que soy un absoluto neofito con los CSS, y me he mandado cada pedazo de error, que ya estoy a punto de botar todo y olvidarme ... pero algo de esperanza me queda al respecto.

al principio me sentia tremendamente feliz porque habia logrado levantar mi sitio en CSS a full, pero al implementarlo me quedaron pifias horrorozas y no se a quien recurrir

tengo muchas dudas, pero partiré con las urgentes, dado que el sitio lo tengo al aire y por mis errores mi nivel de visitas se desplomó :(

1.- Error de visualizacion a 800x600

Si, aún hay gente que ve mi web a 800x600 y no es poca, y esta web se ve de lo mejor de 1024x768 hacia arriba.. todo lo que este debajo se vuelve un soberano desastre.

esta es la URL del sitio
http://www.guiapsu.cl/foro/preuniversitarios/beca-en-el-cepech-t6576.html

y asi se vé a 800x600



les copio el Layout.css de mi sitio

Código:

body {
	margin: 			0;
	padding:			0;
}
#cuerpo {
	position:			absolute;
	width:				1000px;
	left:				50%;
	margin-left:		-500px;
}

#contenedor {
	width:				820px;
}

#topbar1 {
	width:				820px;
	height:				30px;
	background:			url('images/topbar1.gif') no-repeat;
	text-align:			right; margin-left:0; margin-right:0; margin-top:10px; margin-bottom:0
}

#topbar1 ul {
	padding:			6px 10px 0 0;
	margin:				0;
}

#topbar1 ul li {
	display:			inline;
	margin:				0 0 0 4px;
}

#topbar2 {
	width:				820px;
	height:				30px;
	background:			url('images/topbar2.gif') no-repeat;
	text-align:			right
}

#topbar2 ul {
	height:				26px;
	padding:			6px 10px 0 0;
	margin:				0;
}

#topbar2 ul li {
	display:			inline;
	margin:				0 0 0 4px;
}

#contenido {
	width:				820px;
}

#banner1 {
	width:				728px;
	height:				90px;
	margin:				10px 0 0 0;
	background-color:	#fff;
}

#login {
	float:				right;
	width:				160px;
	height:				80px;
}

#menu {
	float:				right;
	width:				370px;
}

#secciones {
	width:				370px;
	height:				86px;
	background:			url('images/secciones.gif') no-repeat;
	text-align:			right; padding-left:0; padding-right:0; padding-top:24px; padding-bottom:0
}
#secciones ul {
	margin:				0;
	padding:			2px 0 0 0;
}

#secciones ul li {
	display:			inline;
	margin:				0 4px 0 0;
}

#buscar {
	float:				left;
	width:				170px;
	background:		#ffe5c0 url('images/buscar.gif') no-repeat;
	text-align:		center; padding-left:0; padding-right:0; padding-top:30px; padding-bottom:0
}

#material {
	float:				left;
	width:				170px;
	background:			#cbeff0 url('images/material.gif') no-repeat;
}

#debates {
	float:				right;
	width:				200px;
	background:			#dcf0b6 url('images/debates.gif') no-repeat;
}

#debates ul {
	padding:			26px 10px 0 0;
	margin:				0;
}

#debates ul li {
	list-style:			none;
	margin:				4px;
	border-bottom:		1px solid #73ae00;
}

#principal {
	float:				right;
	padding:			0 10px 0px 10px;
	width:				430px;
	min-height:			400px;
}

#pie {
	width:				820px;
	height:				24px;
	background:			url('images/pie.gif') no-repeat;
	text-align:			center; padding-left:0; padding-right:0; padding-top:6px; padding-bottom:0
}

#banner2 {
	float:				right;
	height:				600px;
	width:				160px;
	margin:				10px 0 0 0;
}

.clear {
	clear:				both;
}

de a poquito los molestaré a fin de no convertirme en una úlcera en sus estómagos.

Saludos

[Mikmoro]

El problema lo tienes aquí:

#cuerpo {
position: absolute;
width: 1000px;
left: 50%;
margin-left: -500px;
}

que imagino que has hecho eso para centrar la página, y en realidad te sobra. Ponlo así:

#cuerpo {
width: 1000px;
}

y elimina el width de 860px del body, e imagino que te funcionará como quieres.

Mikel.