Como alinhar dois textos com fundo de cores em uma coluna

Hola amigos y amigas,

Me encantaría saber el código para alinear dos textos, uno a la izquierda y otro a la derecha, con color de fondo en una misma columna. Aquí muestro una captura de imagen:



Gracias siempre....

Un abrazo.

mete cada uno de los textos en un div diferente, con css uno lo flotas a la derecha y otro a la izquierda y listo

ejemplo:

<div class="div1">
texto1
</div>

.div1{
float:left;
}

Gracias mil, amigo adresc. Se agradece mucho.

Solo me falta saber cómo puedo dar color de fondo como muestro en la imagen de arriba.

Gracias de nuevo y un abrazo.

Sinceramente os recomiendo, que dejéis ya de usar floats y comencéis a usar "inline-block" o bien "inline-text". Estamos ya en HTML5!!! 🙂
Las dos formas son correctas, pero los floats son engorrosos.

El color de fondo se define con "background". El color de las letras con "color". Y en todo caso, si querés un borde blanco con "border".

.div1{float:left;}
.div2{float:right;}
.div1, .dvi2{background:#ffff00;color:#fff;border: 1px solid #fff;}

El grueso del borde lo podés cambiar, así como también el tipo de borde y su color.
En caso de que te llegue a dar algún tipo de problema vas a tener que definir el "width" de cada uno. Supongamos "widht:250px;" para cada uno. O el tamaño que quieras, siempre que no te excedas. En tal caso no colapsarán, sino que la segunda columna empezará donde termine la primera. (No se si me expliqué bien... 😛 )

Infinitas gracias, amigo memiliano. Tomo nota.

Mis mejores deseos a todos, y un abrazo.

adresc disse:

mete cada uno de los textos en un div diferente, con css uno lo flotas a la derecha y otro a la izquierda y listo

ejemplo:

<div class="div1">
texto1
</div>

.div1{
float:left;
}

Clique para expandir...

No es correcto usar tantos Div's. Menos en pequeños textos en donde no es necesario hacerlo.