Texto vertical

 Ejemplo:

Parque del Plata

- El Balneario "Parque del Plata" se encuentra situado a orillas del Río de la Plata, y pertenece al Departamento de Canelones, República Oriental del Uruguay, a unos 50 km al este de Montevideo.

- La belleza del lugar se acrecienta, porque sus playas son anchas con enormes dunas de arena fina y blanca, componen un ambiente natural característico de la costa de Canelones.

- Sus aguas son semi salinas, tranquilas, seguras y aptas para el disfrute de toda la familia.

- Es un balneario rodeado de pinos y eucaliptos.

- Otros de sus grandes atractivos es el arroyo Solís Chico, con un paseo muy pintoresco y natural. Muy adecuado para los deportes náuticos y la pesca, disfrutando de la paz con la familia y los amigos.

- Sin dudas Parque del Plata es uno de los balnearios más atractivos de la extensa costa de Canelones.

- Las características principal que define a Parque del Plata es la paz y tranquilidad que en él reinan, lo que lo cataloga como un balneario para todas las edades. A esto se suma que cuenta con todos los servicios necesarios que un balneario turístico internacional requiere para recibir visitantes de todas partes del mundo.

- Los principales servicios con que cuenta Parque del Plata son:

• Hotelería.
• Inmobiliarias para alquiler de casas, cabañas, bungalós y chalet.
• Camping.
• Sanatorios, policlínicas y emergencia médica.
• Clubes deportivos.
• Restaurantes.
• Paradores.
• Comercios en General.
• Supermercados muy económicos.
• Entretenimientos.
• Playa.
• Arroyo.
• Plazas.
• Internet.
• Transporte.
• Policía local.
• Salvamento.

- Y Todas las Comodidades para pasar unas vacaciones muy confortables y tranquilas en un ambiente familiar.

¿Cómo se hace...?

Ir a Diseño, Edición de HTML y justo arriba de ]]></b:skin>

Poner el siguiente código:

.vertext-left{

/* Valores de la Caja */

width:25px;
margin-right:10px;
padding: 0 5px;
border:1px solid #66CCFF;

/* Valores del Texto */

text-align: center;
color:#66CCFF;
font-size:40px;
line-height:45px;
float:left;
}

.vertext-right{

/* Valores de la Caja */

width:25px;
margin-left:10px;
padding: 0 5px;
border:1px solid #66CCFF;

/* Valores del Texto */

text-align: center;
color:#66CCFF;
font-size:40px;
line-height:45px;
float:right;
}

En la entradas poner el siguiente código:

Para la izquierda:

<div class="vertext-left" >Texto&ensp;left</div>
---ACÁ EL RESTO DEL TEXTO ---

Para la derecha:

<div class="vertext-right" >Texto&ensp;right</div>
---ACÁ EL RESTO DEL TEXTO ---

Para crear la separación entre las palabras, le agregamos &ensp;

Modificamos el código CSS para adaptar al diseño de su blog: borde de la caja, color del texto, tamaño del texto, ancho de la caja, separación del texto, margen y padding.

Si queremos podemos poner el estilo dentro del div cada ves que lo queramos utilizar:

<div style="width:25px;margin-right:10px;padding: 0 5px;border:1px solid #66CCFF;text-align: center;color:#66CCFF;font-size:40px;line-height:45px;float:left;" >Texto&ensp;left</div>
---ACÁ EL RESTO DEL TEXTO ---

El ejemplo es para la izquierda, de la misma forma sería para la derecha, cambiando el estilo.

Guía de referencia CSS