HTML - 3 columnas html

 
Vista:

3 columnas html

Publicado por Inknowa (4 intervenciones) el 07/07/2016 13:03:19
Hola, en primer lugar gracias por el soporte que ofrecéis y por el foro. Soy nuevo en el diseño de webs, uso de HTML y CSS, y tengo un problema con la página de contacto que estoy realizando.

Estoy utilizando WordPress y una plantilla bastante sencilla, pero el problema es que quiero hacer 3 columnas y que me queden bien alineadas en la página de contacto de mi web:

- En la primera columna quiero que estén mis datos de contacto.
- En la segunda columna quiero que haya un formulario para el contacto.
- En la tercera columna quiero que haya la ubicación de google maps.

He conseguido poner los 3 en una tabla usando únicamente HTML, y las dos primeras columnas me quedan bien alineadas, pero la tercera, que es donde está el mapa, me queda más arriba de lo que deseo, ya que se sitúa automáticamente por encima de las otras dos columnas. Dejo una captura para que veáis a lo que me refiero:

http://i68.tinypic.com/1ywhw7.jpg

Lo que pone sdfsdf... son los datos de contacto que pondré más adelante.

Os pongo también el código HTML que me está dando problemas:

<strong>RELLENE EL FORMULARIO O LLÁMENOS</strong>
<table>
<tbody>
<tr>
<td>
<table>
<tbody>
<tr>
<td>sdfsdf
sdfsdf
sdfsdf
sdfsd
sdfs</td>
</tr>
</tbody>
</table>
</td>
<td>
<table style="height: 295px;" width="115">
<tbody>
<tr>
<td>[contact-form-7 id="18" title="Contact form 1"]</td>
</tr>
</tbody>
</table>
</td>
<td>
<table>
<tbody>
<tr>
<td><iframe src="https://www.google.com/maps/embed?pb=!1m21!1m12!1m3!1d384.3752769695892!2d2.6350438922607693!3d39.58210043426137!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m6!3e6!4m3!3m2!1d39.5821082!2d2.6352598!4m0!5e0!3m2!1ses!2ses!4v1467884374271" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>

¿Podría alguien ayudarme a ajustar esa tercera columna con el mapa para que las 3 estén a la misma altura solo con el código HTML? Me estoy volviendo loco y estoy intentando no usar css para no complicarme de momento, pero si no quedara otro remedio lo haré así.

Gracias de antemano, un saludo.

Inknowa
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

3 columnas html

Publicado por Inknowa (4 intervenciones) el 07/07/2016 13:58:56
He intentado editar la anterior publicación pero no he podido. He estado probando más opciones y con todas ocurre lo mismo, pero si sustituyo el mapa por texto o por otro formulario no hay problema y quedan alineados, por lo que doy por hecho que el problema está en el mapa de Google

Aún así, no sé que cambiar o añadir para que quede alineado, ya que con las propiedades que he probado a cambiar (todas las que veis en el código) no ha cambiado nada, así que sigo necesitando ayuda para saber como alinearlo. Gracias de nuevo de antemano, un saludo.

Inknowa
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

3 columnas html

Publicado por Inknowa (4 intervenciones) el 07/07/2016 14:31:38
Perdón, acabo de darme cuenta de que no se veía la imagen. Este es el enlace para verla, perdón por las molestas y por el triple post:

https://postimg.org/image/oh5psb2gx/
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

3 columnas html

Publicado por DAVID (94 intervenciones) el 08/07/2016 07:49:55
Hola,
No se puede acceder a la web. :-/
De todas formas, has probado bootstrap?? Es un framework css que divide la pantalla en 12 columnas. Es muy fácil de manejar, y tiene un monton de componentes asociados. Mira a ver, si con eso, solucionas tu problema de las columnas.
Por otra parte, en tu código, he visto que tienes puesto un ancho fijo. Y eso, no es responsive, con lo cual, google te va a penalizar por ello.

Un saludo,
David
diseño web madrid
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

3 columnas html

Publicado por Inknowa (4 intervenciones) el 08/07/2016 09:22:23
Tienes toda la razón, el ancho se ajustó en uno de los múltiples intentos por colocarlo y me olvidé de cambiarlo. Por otra parte, al final he conseguido solucionarlo introduciendo simplemente una línea en blanco por encima del mapa, y ya queda totalmente ajustado. Aún así, lo más probable es que tenga que utilizar varias columnas constantemente, por lo que descargaré el plugin que mencionas para ir probándolo. Muchas gracias por la información y por tu ayuda, un saludo.

Inknowa
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar