JMiur [E]

A la pregunta de ¿cómo centrar algo? uno debería repreguntar: ¿qué queremos centrar? ¿el contenedor o el contenido? Y esta pregunta debería resultar bastante sencilla de responder si entendemos sus diferencias.

28 comentarios:

Gem@  

Algo muy básico e importante :)

Responder
JMiur  

Saludos, Gem@. Sí; es básico :D

Responder
Claudio - Poca Tinta  

Buenas recomendaciones, voy a ser un poco mas ordenado.

Slds

Responder
Anónimo  

Jejeje , muy bueno. Siempre uso <center><center/>. Lo voy a tener en cuenta :)

Responder
Anónimo  

Perdon </center>

Responder
Adrián  

esta interesante

Responder
Anónimo  

básico pero muy bien explicado. y no está mal recordarlo y tenerlo a mano

Responder
JMiur  

Saludos, Sandra. Gracias por el comentario.

Responder
Andrés  

Hola JMiur, tengo un menú en el blog, pero se decentra en un monitor de 17 pulgadas, en el de 19 pulgadas no hay problema, no puedo centrarlo para que se vea bien en cualquier tamaño de monitor, podrías ayudarme, te lo agradeceria muchisimo, ya que estoy lidiando con esto mucho tiempo, un cordial saludo.

Responder
JMiur  

Tal como está ahora, lo mejor es que uses las propiedades de este blog:
http://selectprint.blogspot.com/
en este otro:
http://polopublicitario.blogspot.com/
ya que allí se ve centrado (es por display: table;)

Otra posibilidad es colocar el menú dentro de un DIV y que este tenga la imagen de fondo y margin:0 auto; dimensionado UL con width.

Usar padding para posiiconar UL no es buena idea y es lo que hace que se ubique a cierta distancia que no se verá igual en todas las resoluciones.

Responder
Andrés  

JMiur, no entiendo mucho de códigos, podrías indicarme que codigos tengo que borrar y que aumentar, el blog que uso es el primero el segundo es el borrador, te mando un saludo cordial.

Responder
JMiur  

Lo que parece funcionar bien entonces, es el blog de prubas así que busca esta parte:

/*Credits: CSSplay */
/*URL: http://www.cssplay.co.uk/menus/pro_four */
.preload4 { ................
.menu4 { ................
.menu4 li {................
.menu4 li a {................
.menu4 li.current a {................
.menu4 li.current a b {................
.menu4 li a:hover {................
.menu4 li a:hover {................
.menu4 li.current a:hover {................
.menu4 li.current a:hover b {................

Cípiala y busca la misma parte en el original, cambias una por otra y así ambos quedan iguales.

Responder
Andrés  

Hola JMiur, ya efectué los cambios pero aun continua descentrandose todo, hasta el menú se pone en dos niveles, es decir como si le hubiese dado enter y continuara a la siguiente linea, parece que hay algun conflicto con el codigo de la plantilla, crees que haya alguna solución, te agradesco de antemano, saludos.

Responder
JMiur  

Ahora ambos se ven descentrados así que, es probable, es que hayas copiado al revés.

Lo más sencillo es volver al principio y colocar un DIV que contenga el menú, agregando <div id="menu"> antes de ul y cerrándolo al final, que quede de este modo:

<div id="menu">
<ul id="top" class="menu4">
<li> .............
......................
</ul>
</div>

Luego una definción neuva y un cambio en el CSS:

#menu {background:transparent url(http://i645.photobucket.com/albums/uu175/andres201070/profour0tc2.gif) repeat 0 0;width:100%;height:35px;}

.menu4 {
list-style-tipe:none;
margin:0 auto;
padding:0;
width:770px;
}

Responder
Andrés  

JHiur, te envio la imagen que se ve en la opcion diseño para que lo veas mejor, si te das cuenta la barra de blogger esta a la derecha y al parecer esa es la causa del desorden, ¿como podria hacer para que la barra de blogger que está oculta, se centre y quizas asi el menu no quede en 2 lineas en un monitor de 17 pulgadas?. Te agradesco de antemano.
http://i866.photobucket.com/albums/ab223/selectprint_/diseo.jpg

Responder
JMiur  

No veo que hayas agregado lo que te dije. Todo sigue igual.

Lo que ves en diseño nada tiene que ver con la forma en que se ve el blog. La NavBar está oculta y por lo tanto, no afecta al blog en si mismo.

Lo que se ve en diseño es sólo una representación aproximada de la distribución de las diferentes secciones y su únic utilidad es editar los diferentes elementos.

Es probable que la Navbar se muestre en una segunda línea de esa ventana de diseño si agregas algo así:

#navbar {clear:both;}

Responder
Andrés  

Hola JMiur, ya coloqué los códigos...¡¡¡, ahora si se centran bien, pero si te darás cuenta le aparecen unos puntitos rojos que salen al costado de en cada palabra del menú, como puedo hacer para que se eliminen estos puntos y si se puede dejar la barra de canto a canto pues tiene mejor vista ( http://i866.photobucket.com/albums/ab223/selectprint_/asi_estaba.jpg ), ese es el unico detalle, espero resolverlo pronto, muchas gracias de antemano.

Responder
Andrés  

Una observación, en Internet explorer no se ven las casillas del menú.

Responder
JMiur  

Cambia las propiedades. que queden exactamente así:

#menu {
background:url("http://i645.photobucket.com/albums/uu175/andres201070/profour0tc2.gif") repeat scroll 0 0 transparent;
height:35px;
width:100%;
}

.menu4 { margin:0 auto; padding:0; width:770px; }

.menu4 li { list-style-type:none; }

Responder
JMiur  

Primero, cambia lo que te dije.

Segundo, las casillas se ven lo que no se ve es el fondo porque hay un error de sintaxis, te falta separar el paréntesis de cierre de la imagen de la palabra repeat con un espacio.

Responder
Andrés  

No lo puedo creer...¡¡¡
Pensé que era imposible...¡¡¡
Te estoy realmente muy agradecido...¡¡¡
No sabes como he sufrido con esto...¡¡¡
Muchisimas Gracias, que Gusto me da que seas Argentino...¡¡¡
Te mando un abrazo enorme de todo Corazón.
Exitos para ti en TODOS tus proyectos... y que Dios te permita Conocerle... eres un ser muy valioso.
MUCHAS GRACIAS...¡¡¡

Responder
JMiur  

Me alegro que se haya arreglado :-)

Responder
Unknown  

Una pregunta, como hago para que las entradas salgan centradas por defecto?

Responder
JMiur  

No sé cuál es tu blog así que no sé cuales son los nombres de los distintos IDs o clase. Por defecto, el rectángulo que contiene las entradas tiene laclase post-body así que la regla sería:

.post-body {text-align:center;}

Pero, dependerá también de qué tipo de cosas agregues en las enradas.

Responder
Unknown  

Bueno ese es mi blog y he estado probando esta plantilla antes de ponerla en otro blog:
http://blogdepruebadub.blogspot.com/2011/05/quinto-post.html

he probado poniendole a todo {text-align:center;} pero los videos salen a la izquierda aun :S

gracias por la respuesta :)

Responder
JMiur  

No y si, depende del tipo de video o mejor dicho, tal como lo comentaba antes, depende del tipo de contenido que agreguea a las entradas,.

Un video de YouTube colocado pomo en el Segundo post se centrará, un DIV con un estilo aprticular como el de las pestañas que se ve en el Quinto post requiere otro tipo de solución lo mismo que el video del Tercer post.

No existe ninguna forma de establecer propiedades genéricas absolutas para todo tipo de contenido y siempre será necesario agregarlas en el mismo post a menos que lo que se publique sea algo estandarizado.

Responder
Unknown  

ok, muchas gracias JMiur entendi perfectamente entonces tendre que modificar entrada por entrada. ;)

Responder
JMiur  

Sí, no hay más remedio.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR