Alinear div a la derecha dentro de otro?

[kidart]

Hola, consulto al foro ya que estoy incursionando en el armado con div.
Supongo que la consulta debe ser bastante simple:

tengo este html.

Tengo un div "texto_contacto" que contiene un texto y otro Div. La duda es como hacer para que todo el texto este alineado a la izquierda y el Div contenido se aline a la derecha...

Código HTML:

<div id="texto_contacto">
<img src="images/contacto_ellugar.jpg" width="816" height="71" />
<p>
  Direccion y como llegar<br>
Heroes de Malvinas 401, San Isidro
</p>
<p>
Direccion y como llegar<br>
Heroes de Malvinas 401, San Isidro
</p>
<div id="google_map">
<iframe width="150" height="150" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com.ar/maps?q=heroes+de+malvinas+400+san+isidro,+buenos+aires,+argentina&amp;oe=utf-8&amp;client=firefox-a&amp;ie=UTF8&amp;hq=&amp;hnear=Heroes+de+Malvinas+400,+San+Isidro,+Buenos+Aires&amp;gl=ar&amp;t=h&amp;vpsrc=6&amp;ll=-34.464196,-58.517668&amp;spn=0.002654,0.003197&amp;z=16&amp;iwloc=A&amp;output=embed"></iframe><br /><small><a href="http://maps.google.com.ar/maps?q=heroes+de+malvinas+400+san+isidro,+buenos+aires,+argentina&amp;oe=utf-8&amp;client=firefox-a&amp;ie=UTF8&amp;hq=&amp;hnear=Heroes+de+Malvinas+400,+San+Isidro,+Buenos+Aires&amp;gl=ar&amp;t=h&amp;vpsrc=6&amp;ll=-34.464196,-58.517668&amp;spn=0.002654,0.003197&amp;z=16&amp;iwloc=A&amp;source=embed" style="color:#666666;text-align:left">Ver mapa más grande</a></small>
</div>
</div>
 

Gracias.

[caricatos]

Hola:

Más que html es cosa de estilos... los contenidos en línea se alinean con text-align, y para el div lo puedes "flotar", pero antes darle una anchura (width)... y sobre lo de flotar, abría que ponerlo a la altura de donde lo quieras tener alineado, o sea, posiblemente deba ser el primer tag del contenedor...

Saludos

[kidart]

Muchas gracias por la respuesta, ahi logre alinearlo a la derecha con el text align, pero me queda por debajo del texo, se puede poner a la misma altura horizontal???

Código CSS:

#texto_contacto {
    position:relative;
    margin-left:67px;
    width: 816px;
}
 
#texto {
    position:relative;
    width: 500px;
}
#google_map {
    text-align:right;
    margin-right: 0px;
    margin-top:0;
}
 

[caricatos]

Iniciado por caricatos

... y sobre lo de flotar, abría que ponerlo a la altura de donde lo quieras tener alineado, o sea, posiblemente deba ser el primer tag del contenedor...

No creo que con estilos solamente puedas, sino reestructurando el contenido, tal como comenté antes...

Saludos

[charlyalegret]

debes crear un div para cada elemento y luego lo que te comentaron de float. Por ej.:

Código HTML:

<div id="texto_contacto">
    <div id="texto">
    <img src="images/contacto_ellugar.jpg" width="816" height="71" />
    <p>
      Direccion y como llegar<br>
    Heroes de Malvinas 401, San Isidro
    </p>
    <p>
    Direccion y como llegar<br>
    Heroes de Malvinas 401, San Isidro
    </p>
    </div>
    <div id="google_map">
    <iframe width="150" height="150" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com.ar/maps?q=heroes+de+malvinas+400+san+isidro,+buenos+aires,+argentina&amp;oe=utf-8&amp;client=firefox-a&amp;ie=UTF8&amp;hq=&amp;hnear=Heroes+de+Malvinas+400,+San+Isidro,+Buenos+Aires&amp;gl=ar&amp;t=h&amp;vpsrc=6&amp;ll=-34.464196,-58.517668&amp;spn=0.002654,0.003197&amp;z=16&amp;iwloc=A&amp;output=embed"></iframe><br /><small><a href="http://maps.google.com.ar/maps?q=heroes+de+malvinas+400+san+isidro,+buenos+aires,+argentina&amp;oe=utf-8&amp;client=firefox-a&amp;ie=UTF8&amp;hq=&amp;hnear=Heroes+de+Malvinas+400,+San+Isidro,+Buenos+Aires&amp;gl=ar&amp;t=h&amp;vpsrc=6&amp;ll=-34.464196,-58.517668&amp;spn=0.002654,0.003197&amp;z=16&amp;iwloc=A&amp;source=embed" style="color:#666666;text-align:left">Ver mapa más grande</a></small>
    </div>
    </div>
 

Código CSS:

#texto_contacto {
        position:relative;
        margin-left:67px;
        width: 816px;
    }
     
    #texto {
        position:relative;
        float:right;
        width: 600px;
    }
    #google_map {
        text-align:right;
        float:left;
        margin-right: 0px;
        margin-top:0;
    }
 

A partir de ahí ya ajustarlo como más te guste...

[kidart]

gracias!!!