Text-align:center??

Lorelopez · #1 (**permalink**) 02/09/2009, 13:46

* {margin: 0; padding: 0;}

html, body {
width: 100%;
height: 100%;
text-align: center; /*es imprescindible para el reseteo??*/
}

He leído que esta es la manera de empezar cualquier hoja de CSS por si las moscas...

A mi me está complicando la vida lo de TEXT-ALIGN:CENTER ya que tengo que declarar en cada lugar otro tipo de posicionamiento del texto, así que mi pregunta es:

¿es realmente imprescindible esta declaracion al comienzo de la hoja?

alexk · #2 (**permalink**) 02/09/2009, 13:50

nop... ya que como bien dices... luego a los elementos hijo tendrás que ponerles ala alineación hacia la izquierda... y mmm es mucho lio...

Lorelopez · #3 (**permalink**) 02/09/2009, 13:53

Ok, o sea que la borro y no pasa nada? Pero entonces, esas RESET CSS de líneas interminables, ¿realmente conviene añadir algo así para que todo funcione correctamente o es excesivo?

Gracias!!

alexk · #4 (**permalink**) 02/09/2009, 14:08

si la borras lo que pasara es que no estara centrado el texto jeje...
y en cuanto a los reset, pues no me atrevo a generalizar pero sip (aveces) hay reset enormes y que pss... no necesitamos mucho... es decir si nuestra estructura es muy basica y no veo por que aplicar reset tan grandes ok son muy utiles pero depende de cada quien. yo aplico
* {margin: 0; padding: 0;border:0;outline:0;position:relative;}
es el reset que uso y ya... el resto con tus elementos bien posicionados debe funcionar bien en otros navegadores...

latindesign · #5 (**permalink**) 02/09/2009, 14:17

Cita:

Iniciado por alexk

* {margin: 0; padding: 0;border:0;outline:0;position:relative;}
es el reset que uso y ya... el resto con tus elementos bien posicionados debe funcionar bien en otros navegadores...

En realidad puede que sea cierto pero en cosas sencillas como dices, pero si te pones a hacer un landpage de una pagina e-commerce por ejemplo ya veras que eso no te va servir. Nota(Ademas con eso borras el border y outline de los elementos FORM como los input)

Tambien no se por que le pones a todos los elementos *relative lo veo inutil el outline solo sirve para los enlaces y no para un elemento p ,h1 div ,etc..

en realidad el reset universal es * y lo mas usado es

* {
margin:0px;
paddding:0px;
}

a {outline:none;}

img {border:0px;}

eso no te va librar del problema que traen los elementos FORM para ello existe un reset muy bien logrado el de Eric Meyer analizando eso puedes construir el tuyo propio hay muchos patrones como el de las fuentes relativas EM diseños liquidos ... y muchas mas con eso no solucionas .. todo

el text align:center se usar en el body {} sirve para alinear en IE 5 de ahi puedes remediar el align x ejemeplo en el div#wrapper con text-align:left;

Lo mejor como ya te comente arriba es que vayas probando muchos tipos de Reset y construyas el que mejor se comporte con la pagina que estas logrando.

alexk · #6 (**permalink**) 02/09/2009, 14:22

lo se, y los conosco esos reset...
en cuando al a y img, yo lo hago asi *{} por pereza... y no crear mas... relative... igual... por pereza... e-commerce no eh usado pero si eh implementado en wordpress muy detallados y me vale... como digo despues del reset el resto depende de que tus elementos esten bien posicionados.. "floats, clears, etc"...

webosiris · #7 (**permalink**) 02/09/2009, 14:38

lo de los resets kilométricos si, son un caso de exageración aguda. Llevo más de 100 proyectos diferentes maquetados (lo que suman unos cuantos cientos sino miles de htmls) y el único restet que uso es

Código css:

Ver original*{margin:0;
padding:0;
border:0}

nunca he tenido ni un solo problema.

latindesign · #8 (**permalink**) 02/09/2009, 14:48

Cita:

Iniciado por webosiris

lo de los resets kilométricos si, son un caso de exageración aguda. Llevo más de 100 proyectos diferentes maquetados (lo que suman unos cuantos cientos sino miles de htmls) y el único restet que uso es

Código css:

Ver original*{margin:0;
padding:0;
border:0}

nunca he tenido ni un solo problema.

interesante...

Lorelopez · #9 (**permalink**) 02/09/2009, 15:56

Pues ya me surge un problemilla relacionado que no sé si tendrá que ver con haber eliminado . la declaración TEXT-ALIGN:CENTER como os decía.
Por ejemplo, para el footer he escrio:

<table class="pie">
<tr >
<td><p>©2009 All Rights Reserved</p>
</td>
</tr>
</table>

Donde:

table.pie {
width: 800px;
height:5%;
font-family: Georgia, "Times New Roman", sans-serif;
font-size: 0.7em;
color: black;
text-align: center;
line-height:30px;
}

PERO PASA DEL TEXT ALIGN y el capullín me lo alinea a la izquierda, con lo que he tenido que crear otra clase para <p> para que me lo centre.

¿Se os ocurre por qué lo ignora?

Gracias!!!!

webosiris · #10 (**permalink**) 02/09/2009, 16:02

Lorelopez, usa html semántico, que es eso de usar una tabla para escribir un párrafo?? El css necesita primero una buena base, así que te recomiendo aprender html antes de estudiar css.

Lorelopez · #11 (**permalink**) 02/09/2009, 16:06

Tomaaaaaaaaaaaaaaaaa, eso sí ha sido duro, ¿me lo repites?
Si tengo una web basada en tres tablas que hacen a su vez de header, cuerpo y footer, y en el footer solo hay un contenido, ¿que es lo que está tan mal?

alexk · #12 (**permalink**) 02/09/2009, 16:25

Cita:

Si tengo una web basada en tres tablas que hacen a su vez de header, cuerpo y footer, y en el footer solo hay un contenido, ¿que es lo que está tan mal?

que en vez de ser 3 tablas deberían ser 3 "div" y para párrafos están los "<p>"

latindesign · #13 (**permalink**) 02/09/2009, 16:27

Desarrolla el proyecto como puedas la cosa es que le saques mucho provecho al proyecto $$$$ y google no te va odiar por usar eso ya que hay muchas webs en la red que estan aun en tablas es como hablar que si tu codigo css no valida no puedes subir tu web :P lo importante es el contenido que publicas en tu sitio web

Lorelopez · #14 (**permalink**) 02/09/2009, 16:32

Alexk, la cosa es que "deberían" quizás mejor "podrían ser" o "alternativamente". No me interesa la eterna disputa table vs. div pero para mi concluye en que la funcionalidad y el deseo o necesidad de usar unos u otro estriba en cada uno, en mi en este caso.
Consultaba para consejo webosiris, no para crítica dolorosa, no todos tenemos tu suerte...

LATINDESIG, MUCHÍSIMAS GRACIAS POR TU ACTITUD, es realmente lo que cuenta, al menos para mi.

Si alguien desea ayudar, aún así agradecería una respuesta funcional.

alexk · #15 (**permalink**) 02/09/2009, 16:33

Cita:

Desarrolla el proyecto como puedas la cosa es que le saques mucho provecho al proyecto $$$$ y google

mmm... google y "$$" ~~(bueno si le paga a alguien tal vez)~~ alineara su texto??? no creo... no es el tema; buen consejo pero asi no aprendera ya que creo yo es su intencion "aprender" sino pues no preguntaría, corrígeme "lore" si no es asi.

table.pie p{text-align: center;}

seguro que sin la "p" el texto se centra (suposición)

chao y suerte!...

latindesign · #16 (**permalink**) 02/09/2009, 16:39

pues ya te envie un mensaje privado Lorelopez lo de semantico significa estructurar el documento con las etiquetas correspondientes y es verdad pero en realidad nadie te a preguntado si tienes 1 semana con html (Nadie de los que te an respondido semanticamente creo que tengan menos de 2 años en esto)jeje :) ya te envio mi msn y te ayudo por ahi

Saludos!

deirdre · #17 (**permalink**) 02/09/2009, 16:42

Hola Lorelopez

Si te refieres al centrado de este párrafo <p>©2009 All Rights Reserved</p> dentro de su celda, queda perfectamente centrado con el código que has puesto, por tanto no es necesario crear otra clase para este párrafo.

Si a tí no te queda centrado es que algún otro código que desconocemos está interfiriendo.

Bye

Lorelopez · #18 (**permalink**) 02/09/2009, 16:44

Muchas gracias Alexk, pues claro que quiero aprender, si no me cogería una plantilla guarra de cualquier esquina y toma copy-paste!!
Pero vaya, que aún que lo que me dices me funciona y centra, sigo sin entender el drama de usar una tabla para el pie...

Un saludo

Lorelopez · #19 (**permalink**) 02/09/2009, 16:46

Deirdre, es lo que me temía, que hay algo por ahi que me lo anula, pero como todo acontecio tras quitar la declaracion del reset pues por eso empezo esta cadena...

THANKX!

alexk · #20 (**permalink**) 02/09/2009, 16:50

no es un drama lore... tan solo que hay "estándares" y fue una recomendación tan solo, por webosiris, bueno yo asi lo vi no fue en plan agresivo ni nada pero bueno... tu implementa como sepas aun que no es lo "correcto" tu razón es que "de otra manera no puedes" (supongo) y eso vale...

igual deirdre lleva razon se debe centrar el texto tal cual pero para no hacer mas rollo lo que te puse debe andar ya que en especifico a ese "p" le dimos centrar pero bueno"

deirdre joer creo que tienes el 3 mejor nick que eh visto el primero fue Hamlet y otro Jamlet jaja... enverda esta muy bueno... yo ese queria pero mejor me lo deje asi chao y un saludo a todos

deirdre · #21 (**permalink**) 02/09/2009, 16:58

Hola Laralopez,

Esto no es un consejo ¡Dios me libre!, sólo es mi opinión:

Yo no he entendido que se diga que es un drama crear una tabla para el pie. Lo que ocurre es que las tablas no se han creado para definir la estructura de los espacios de una página.

Este uso, por otra parte muy abundante, es inadecuado en cuanto a maquetación: la arquitectura subyacente de una página debe ser (nos guste o no; sepamos hacerla así o no) html y css, utilizando contenedores divs para distribuir los espacios. De esta forma se consigue desde lo más sencillo hasta los más complejo en diseño, sin alterar su "calidad" semántica. Hay montones de páginas complejas y bellísimas que serían imposibles de crear con tablas.

Usemos las tablas para su uso adecuado: mostrar datos tabulados.

Una vez lo coges el "truqui" al html y css (divs, etc) verás qué bonito es maquetar páginas web.

Perdón por el "rollo"

Bye

Lorelopez · #22 (**permalink**) 02/09/2009, 17:01

Ok, gracias a todos. Claro Alexk, hago lo que puedo por ahora, hace dos días literalmente que cambié de marcos a tablas y de tablas a pelearme con los div, y todavía los veo como algo bastante "cazurro", supongo que algún día me cambiará el punto de vista.

Ok con lo de la benevolencia al responder pero ya a veces me limito a reservarme las preguntas porque, según a qué nivel, muchos se limitan a volcar links y más links de manuales, etc, etc, etc, y te aseguro que es todo lo que ocupa mis estanterías desde hace semanas, pero las dudas surgen, imagno que no aprendísteis HTML, CSS, ETC en la guardería escuchando a Xuxa ;)

Anda, un beso a todos y buenas noches!!!!

deirdre · #23 (**permalink**) 02/09/2009, 17:15

No, Laralopez...

No te reserves tus dudas: ¿Qué sería de este formidable (para mí) foro sin preguntas. Yo, siempre que sepa de qué hablo, procuro dar respuestas válidas a los problemas planteados.

Te imaginas este foro sin respuestas... bueno pues mucho peor sería sin preguntas.

Bye

webosiris · #24 (**permalink**) 02/09/2009, 17:50

Cita:

Iniciado por Lorelopez

Tomaaaaaaaaaaaaaaaaa, eso sí ha sido duro, ¿me lo repites

jeje, mi intención no era ser "duro", perdona. Solo que no se puede empezar la casa por el tejado.

Te voy a dejar un link de porqué no se debe de diseñar con tablas, (en inglés porque había una versión en español pero desapareció) pero no te asustes que no es ni un manual ni es extenso, es con dibujitos súper didácticos