Salto de linea automático en PRE

[daPhyre]

Como alternativa para hacer un formato de páginas web en el que solo debiera agregar un texto, estaba metiendolos dentro de un <PRE> para que me diera de forma automática los saltos de linea (Uso textos largos, y editarlos manualmente con <BR> o <P> me lleva un tiempo extra que quisiera evitarme)

Obviamente, para que el formato se viera más discreto y atractivo, cambiaba este del PRE en una hoja CSS. Pero al visualizar mi página, me di cuenta que el texto se extendía afuera de la página cuando era muy largo, y me mostraba largas lineas con una Scroll Bar horizontal, en lugar de parrafos.

Inenté varios metodos, como ajustarle el Width, pero nada parece funcionar. ¿Alguien sabe como puedo hacer que se den los saltos automáticos dentro del PRE?

[arriaka]

Hola

La verdad es que el <pre> nunca lo habia ni siquiera oido, pero he mirado lo que es, y creo que no sirve para lo que tu quieres.

El pre es para que tenga en cuenta los Intros que hagas mientras escribes en el codigo. Logicamente, si no metes ningun Intro, no hara ningun salto de linea automatico, por lo que te sale la barra horizontal.

En esta pagina se ve bastante claro: http://www.webestilo.com/html/cap4c.phtml

Saludos

[daPhyre]

Iniciado por arriaka

Hola

La verdad es que el <pre> nunca lo habia ni siquiera oido, pero he mirado lo que es, y creo que no sirve para lo que tu quieres.

El pre es para que tenga en cuenta los Intros que hagas mientras escribes en el codigo. Logicamente, si no metes ningun Intro, no hara ningun salto de linea automatico, por lo que te sale la barra horizontal.

En esta pagina se ve bastante claro: http://www.webestilo.com/html/cap4c.phtml

Saludos

PRE posiblemente es una de las etiquetas menos conocidas. La conocí recientemente, y me he enterado que es la que usan para poner código en páginas por ejemplo, ya que respeta espacios, tabuladores, intros y demás sin tener que poner etiquetas especiales; es por eso que lo he considerado para este objetivo que quiero, desafortunadamente no hace auto-wrap. ¿En verdad esto no es posible?

[Mikmoro]

Le ajustate un width pero no funcionó. Pero... ¿le ajustaste el width al selector "pre" o a su contendor, es decir, a la caja que va a presentar los textos?.

Ajustándolo al contenedor debería funcionar.
Si no es asi, sería mejor que mostraras el código generado html y el css para ver qué ocurre.

Mikel.

[daPhyre]

Iniciado por Mikmoro

Le ajustate un width pero no funcionó. Pero... ¿le ajustaste el width al selector "pre" o a su contendor, es decir, a la caja que va a presentar los textos?.

Ajustándolo al contenedor debería funcionar.
Si no es asi, sería mejor que mostraras el código generado html y el css para ver qué ocurre.

Mikel.

No entendí bien que es lo que me recomendabas, según comprendí, me dices que ponga la instrucción del width directo como <PRE width="100%">, ¿No? Si era esto, de igual forma no funciona, si era otra cosa, agradecería que me dijeras como. De igual forma pongo el código por si alguien puede ayudarme.

pre
{
width=100%;
background-color: #ccc;
border-width: 1px;
border-style: dotted;
border-color: #fff;
padding:10px;
font-family: Arial, Helvetica, sans-serif;
}

Y lo aplico en el html de esta forma:

Código HTML:

<PRE>
Este es un ejemplo de pre.

   Un pre puede aceptar los intros y los espacios al principio...

	Así como tabuladores...

Aquí se pone un ejemplo de una línea larga para que se vea el desborde al final de la página: Blah, Blah, Blah... (Agreguese tantos Blahs como sean necesarios para que sea más grande que la página de internet, y se vea el desborde).
</PRE> 

Según investigué, NetScape si hace un auto-wrap a los PRE, pero me interesa que se haga en todos los navegadores, principalmente en IE que es el que usa la mayoría de la gente (Al menos el usuario general, pues el que sabe se va normalmente por otro).

[Mikmoro]

No , quería decir todo lo contrario.

Te preguntaba si el width se lo estabas poniendo al "pre", porque es lo que creo que no funcionará. Lo que deberías hacer para conseguir el auto-wrap es meter el texto dentro de un contenedor (aunque sea de casi toda la página), y ponerle un width a ese contenedor. De esa manera, el contenedor cortará la línea para que el texto se ajuste a su tamaño.

Mira este ejemplo:

http://www.araudi.net/texto.html

El texto no tiene ni un sólo corte, pero se ajustsa al ancho del contenedor.

Espero que te sirva.

Mikel.

[daPhyre]

Si lo dices por el DIV, ya he intentado poner el pre en un div y un div en el pre. El primero no hacía nada, y el segundo si ajustaba a la página, pero me cortaba el texto después de este y ya no podía verlo.

Se que podría meter el texto en un DIV, pero quiero las posibilidades del PRE de que me respete espacios al principio, y principalmente los intro, pues mi idea es meter textos que ya tengo en mi compu y pegarlos dentro de un PRE para subirlos. De otra forma, tendría que meterle los BR manualmente, y esto me llevaría mucho tiempo que quisiera no aplicar, además de posibles correcciones futuras, y la idea que son decenas de textos que quiero subir de este tipo.

¿Tienes alguna solución que me pueda servir para esto que busco?

[Mikmoro]

Pues entonces igual es que no he entendido el problema.

A ver si es esto:

Si coges tu texto del editor en el que lo tengas, y lo pegas en un editor html como por ejemplo NVU (que es libre, gratuito y en español), en el modo "visión normal" (no en código), él automáticamente te va a meter los br, los espacios, convertirá si tú quieres a código ASCII (por ejemplo á por &aacute;), etc.

No sé bien si es lo que necesitas. Cuando te refieres a "tus textos" y no meter los saltos de línea a mano, lo que no sé es en qué formato tienes actualmente los textos.

Mikel.

EDITO: acabo de comprobar lo que dices, y efectivamente no había entendido la pregunta. Yo optaría por la solución del NVU.

[daPhyre]

Cuando me refería a textos, hablaba de formatos .txt y .doc

Muchas gracias por la solución, me parece una buena alternativa, aunque ya logré conseguir lo que buscaba. Es un poco complejo, pero parece funcionar a la perfección. Lo pongo aquí por si a alguien más le interesa:

Código:

/* Browser specific (not valid) styles to make preformatted text wrap */		

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

De esta forma, uno puede pegar el texto directo en un PRE y así modificarlo directo del código fuente sin problemas (Aunque ahora que lo pienso, quizá vaya a dar problemas de compatibilidad con algunos signos especiales al rededor del mundo). La información la en conseguido en esta página: http://users.tkk.fi/~tkarvine/pre-wr...-opera-ie.html

Muchas gracias por tu ayuda Mikel!

[Mikmoro]

Pues un buen aporte. No lo había visto nunca, pero puede resultar interesante. Te comentaba lo de NVU (o DreamWeaver, si lo prefieres), porque como te dije, además de adecuarte los saltos de línea te puede cambiar automáticamente las eñes, acentos, ampersand, etc.

Me alegro de haber podido ayudarte algo (poco ).

Mikel.