Centrar contenido

[Maru77]

Hola a todos!

Tengo algunos divs que conforman la estructura de una página, pero no logro hacer centrarlos independientemente de la resolución en la que se levante la web.

Les dejo en código, ojalá me puedan guiar un poco.
Muchas gracias!

Código HTML:

<div  class="logo">LOGO</div>

<div class="animacion">ANIMACION</div>

<div class="menubotones" style="left:350px">Home</div>
<div class="menubotones"  style="left:450px">Historia</div>
<div class="menubotones"  style="left:550px">Portfolio</div>
<div class="menubotones"  style="left:650px">Contacto</div> 

CSS

Código HTML:

DIV.logo {
				position: absolute;
				height:150px;
				width:120px;
				top:52px;
				float:left;
				
				/*left:200px;*/		
			   }	
			   
DIV.animacion {
				/*position: absolute;*/
				height:15px;
				width:45px;
				top:0px;
				float:right;
				/*left:915px;	*/		
			   }				   

			   
DIV.menubotones {
					position: absolute;
					height:15px;
					width:90px;
					top:70px;
					float:inherit;
					/*text-align:left;*/
					font-family:Arial, Helvetica, sans-serif;
					font-size:12px;
					font-weight:bold;
					color:#CCCCCC;
					z-index:11;
				  }	

[kseso?]

Lo siento, pero me resulta imposible de creer que a estas alturas sea tan repetitiva este tipo de consulta.

Basta una consulta al buscador /centrar web/ (el de google que está en la parte superior junto al logo) y estoy seguro que arrojará más de 200 resultados.

Y para que no se me diga que no aporto, aquí mis 2 céntimos:
Su código html tiene toda la pinta de sur un menú o una relación de elementos. Para ello, lo apropiado es conformar una lista (ul/li/?)

Y otros 2 céntimos de añadida:

DIV.logo {
position: absolute;
height:150px;
width:120px;
top:52px;
float:left;
/*left:200px;*/
}

Fíjese en lo resaltado en azul. Como ejercicio. Si no encuentra nada en ello, ya lo comentamos.

Atentamente

[alexk]

Iniciado por kseso?

Lo siento, pero me resulta imposible de creer que a estas alturas sea tan repetitiva este tipo de consulta.

2 por semana es la media a lo que va del año XD y las que faltan, es que no se usa el buscador, pero bueno

[kseso?]

Iniciado por alexk

2 por semana es la media a lo que va del año XD y las que faltan, es que no se usa el buscador, pero bueno

Alexk:
¿Y no será más culpa de quienes respondemos una y otra y otra y otra vez más lo mismo que de quien tiene un problema y opta por la vía cómoda de preguntar sin investigar?

Yo creo que sí.
¿Nos habremos vuelto demasiado "políticamente correctos" y tendremos la "piel demasiado fina"?

Atentamente

P.D.: Maru77, lo anterior no es una reflexión dirigida especialmente a usted. Es sobre la situación en general.

[Maru77]

Para nada me lo tomo como algo personal.

De todas maneras gracias por responder, por supuesto que antes de postear hice búsquedas pero como estoy aprendiendo y probé cosas que no funcionaron me animé a escribir la consulta para recibir otro tipo de guía.

De verdad gracias por la paciencia.
Saludos! :)

[alexk]

kseso? pues si... pienso igual llevas razon.

Maru77

[kseso?]

Gracias por su comprensión, Maru77

Es demasiado escaso el código que proporcionó, por lo que cualquier interpretación o análisis posiblemente sea errado.

Como ya le apuntaba, si eso es un menú o una relación de elementos debería utilizar una lista (etiquetas ul/li...) para conformarlo.

No puedo etiquetar de errónea o mala praxis el abuso de la posición absoluta que observo por lo indicado al inicio. Pero casi estoy seguro de ello en un 90%.

Personalmente creo que le sería de utilidad leer las dos guías de migración realizadas por Mikel Morote (Mikmoro) que están en el inicio de este foro de css y tener a mano los manuales de www.librosweb.es (css y html).

Creo que está al inicio en la realización de su web, y esos documentos que le indico le ayudarán en su tarea.

Atentamente

P.D.: creo que su aceptación de nuestras divagaciones se merece un pedazo de código. Así que ahí va una indicación de cómo podría hacer:
Cree una caja contenedora de todo su código, con valor relative en la posición, de la anchura y altura necesarias y le marca como margin: 0 auto; (el valor /cero/ puede alterarlo según sea su necesidad

Eso hará que esta nueva caja se centre respecto a la ventana del navegador (si es hija directa de body). Otra cosa distinta es la posición que ocupen sus div´s dentro de ella, pues los tiene posicionados absolutamente.

Si quiere un ejemplo (algo más complejo y prolijo) para centrar múltiples elementos sin importar el que varíe su número, vea esta página

[Maru77]

Muchísimas gracias!
has sido muy amable, voy a tratar de elaborar el código según las instrucciones recibidas.

El foro no sería posible sin gente como uds. que dedican tiempo y comparten conocimiento, más allá de las "divagaciones" que no están demás porque le dan un toque diferente ;)