Propiedad WHITE-SPACE:pre-wrap; (CSS)

[eduardobrutaldeath]

Hola a todos, mi nombre es Eduardo... disculpen que me presente aquí pero no se donde más hacerlo; bueno tengo una consulta que hacerles,

he creado una página web para una persona,

esta persona actualiza constantemente su web pero, como no sabe hacerlo siempre depende de mí,

yo ya me aburrí de editar por ella todo el tiempo así que, pensé en colocar en su documento CSS la propiedad WHITE-SPACE y el valor PRE-WRAP,

esto con la intención de que cada vez que esta persona ponga un espacio o salto de linea en contenedor, no tenga que estarme llamando para que le solucione el problema sino que automáticamente el navegador muestre los saltos y espacios de linea sin necesidad de etiquetas como P, BR, etc,

aunque he estudiado bien HTML y CSS, nunca había tenido la necesidad de utilizar WHITE-SPACE porque yo armo mi código solo... lo que quiero preguntar es si esta propiedad es la que se usa en los foros, como este por ejemplo, para que el usuario pueda hacer espacios o saltos de línea sin necesidad de poner etiquetas,

Bueno es todo, espero me hayan entendido y me puedan ayudar, gracias...

[pzin]

Bienvenido al foro.

Realmente pre-wrap lo único que hace es que el texto se comporte de forma normal. La única diferencia con el valor por defecto, es que respeta los espacios que hayan en el texto, pero esto no tiene que ver con tu problema.

Vamos, para hacer lo que quieres, no tienes que hacer nada. Porque por defecto el texto se comporta de la forma que dices.

Tal vez lo que ocurra es que si se ponen palabras largas, sin espacios (como URLs) entonces esa palabra no se corta y se sale de su contenedor. Para evitar eso se puede usar:

Código CSS:

word-wrap: break-word
 

[eduardobrutaldeath]

Iniciado por pzin

Bienvenido al foro.

Realmente pre-wrap lo único que hace es que el texto se comporte de forma normal. La única diferencia con el valor por defecto, es que respeta los espacios que hayan en el texto, pero esto no tiene que ver con tu problema.

Vamos, para hacer lo que quieres, no tienes que hacer nada. Porque por defecto el texto se comporta de la forma que dices.

Tal vez lo que ocurra es que si se ponen palabras largas, sin espacios (como URLs) entonces esa palabra no se corta y se sale de su contenedor. Para evitar eso se puede usar:

Código CSS:

word-wrap: break-word
 

Hola, gracias por responder, pero creo que no me has entendido bien, yo quiero hacer esto:

<ARTICLE>
Aquí la persona va a escribir lo que le de la gana, pero por ejemplo si esta persona intenta dar dos espacios en blanco horizontalmente o saltar de línea, no va a poder hacerlo porque no conoce las etiquetas.
</ARTICLE>

Por eso yo había pensado poner el siguiente código en su CSS:

ARTICLE{
height: auto; /el valor auto sería para que no se salga el texto verticalmente en caso exceda el tamaño del contenedor/
width: 500px;
white-space: pre-wrap; /el valor pre-wrap sería para que la persona pueda poner en el editor de texto saltos de línea y espacios sin la necesidad de usar etiquetas/
word-wrap: break-word; /y este valor sería para que por más que una palabra o término sea más grande que el tamaño del contenedor nunca se desborde/
}

Por ejemplo ahora yo estoy escribiendo en este foro y puedo hacer saltos de línea y dejar varios espacios en blanco porque ya está programado... Por eso preguntaba como se hace eso, osea programar con CSS una web para que el navegador muestre tal cual se haya escrito en el editor... no sé si me entiendes...

[Rafael]

No está hecho con css. Eso es en el servidor que convierte los saltos de linea en <br>, revisa el código fuente de esta misma página.

Puedes usar un editor como alguno de estos. No creo que lo vas a solucionar con algún estilo y ya.
http://www.webdesignerdepot.com/2008...-text-editors/

Para esta persona o se le hace un sistema CMS o le cobras por cambios. Seguramente o a tí te va bien financieramente incluso para pagarle a alguien o esta persona se cansará de pagar.

Una alternativa extrema es que configures un editor como Kompozer http://www.kompozer.net/ y esite un archivo incluido en otro con una función del servidor.

Aunque este programa le va a insertar otra vez los head y body por ejemplo, puede resultar.

[pzin]

Pues si quieres hacerlo con CSS, tal cual has dicho. Aunque estás confundido en cuando a height: auto, ya que es el valor por defecto de todos los elementos y no tienes que indicarlo. La gente le atribuye cosas mágicas a eso.

Y como dice Rafael, en esta y la mayoría de webs, para el formato del texto se hace desde algún lenguaje de servidor.

Tal vez te interese implementar cosas como markdown, que suelen haber cosas hechas para todos los lenguajes.

[Rafael]

Estoy revisando mi respuesta y creo me salí del tema.

Aterrizo. Un foro en general, usa una cosa llamada nl2br. Que convierte los saltos de linea a br.

Por otro lado, sí, la propiedad pre-wrap debe ser la más adecuada para el caso que pones, suponiendo que todo lo del CMS ya está resuelto.

[eduardobrutaldeath]

Iniciado por Rafael

No está hecho con css. Eso es en el servidor que convierte los saltos de linea en <br>, revisa el código fuente de esta misma página.

Puedes usar un editor como alguno de estos. No creo que lo vas a solucionar con algún estilo y ya.
[url]http://www.webdesignerdepot.com/2008/12/20-excellent-free-rich-text-editors/[/url]

Para esta persona o se le hace un sistema CMS o le cobras por cambios. Seguramente o a tí te va bien financieramente incluso para pagarle a alguien o esta persona se cansará de pagar.

Una alternativa extrema es que configures un editor como Kompozer [url]http://www.kompozer.net/[/url] y esite un archivo incluido en otro con una función del servidor.

Aunque este programa le va a insertar otra vez los head y body por ejemplo, puede resultar.

¿Me estás diciendo que tendría que hacer un editor de texto?
Mmm... nunca he hecho uno, mi nivel de HTML y CSS es avanzado pero, en PHP estoy en básico...

[eduardobrutaldeath]

Iniciado por Rafael

Estoy revisando mi respuesta y creo me salí del tema.

Aterrizo. Un foro en general, usa una cosa llamada nl2br. Que convierte los saltos de linea a br.

Por otro lado, sí, la propiedad pre-wrap debe ser la más adecuada para el caso que pones, suponiendo que todo lo del CMS ya está resuelto.

Si conozco el NL2BR, lo he estudiado en PHP, aunque como dije, por ahora mi nivel de PHP es básico... Además, la página de esta persona es simple, no tengo intención de convertirla en un foro... Solo quería una solución fácil, y lo más fácil que se me ocurrió fue WHITE-SPACE.

[Rafael]

Dale una revisada a los includes. Básicamente lo que se puede hacer es que pongas tu diseño, y digamos que dejas un espacio digamos un div "contenido".

Y de ahí pones dentro otro archivo.

Para cierto apartado de un cliente, de plano hice esto del Kompozer, que es una solución un poco "cutre" (mala calidad) En ese include esta direccionado a un ejemplo.html. Ese arhivo lo editan con unas normas básicas, por ejemplo usar titulos y subtitulos, y no andar de creativo subrayando y cambiando fuentes.

El único problema es que el kompozer vuelve a generar encabezados para ese archivo. Fuera de eso la persona puede hacer mermelada de fresa dentro del archivo y no pasa a mayores.

[pzin]

A mi nunca me gustó nl2br(), porque no diferencia entre lineas nuevas y párrafos. Por eso decía que markdown suele ser una buena opción. Parseas todo el texto como markdown, como digo, habrán cosas en cualquier lenguaje, y ya te olvidas de todos los problemas que comentas e incluso le das la posibilidad de formatear con negritas, cursivas y demás.

[Rafael]

Iniciado por pzin

A mi nunca me gustó nl2br(), porque no diferencia entre lineas nuevas y párrafos.

... La mayoría de los usuarios tampoco...