Foros del Web » Creando para Internet » HTML »

[SOLUCIONADO] Divs para resultados Mysql

Estas en el tema de Divs para resultados Mysql en el foro de HTML en Foros del Web. Hola FDW, quería lograr mostrar las búsquedas así como hace Google, que centra los resultados y a la izquierda las herramientas de búsqueda, como si ...
  #1 (permalink)  
Antiguo 24/04/2013, 11:27
Avatar de xarmagedonx  
Fecha de Ingreso: marzo-2009
Mensajes: 360
Antigüedad: 12 años, 3 meses
Puntos: 29
Busqueda Divs para resultados Mysql

Hola FDW, quería lograr mostrar las búsquedas así como hace Google, que centra los resultados y a la izquierda las herramientas de búsqueda, como si fueran 2 columnas.

Actualmente lo hago así:
Código HTML:
Ver original
  1. echo "<div id=\"Estructura\">";
  2.    echo "<div id=\"Anuncios\">";
  3.    echo "<p>Hola, este es un ejemplo de un anuncio, que también puede ser una imagen</p>";
  4.    echo "</div>";
  5.    echo "<div id=\"Resultados\">";
  6.   while($row = $sqlBuscar->fetch_array(MYSQLI_BOTH)){
  7.             echo "<strong><a href=$row[weburl]>$row[webTitulo]</a></strong>";
  8.             echo "<p>$row[weburl]</p>";
  9.             echo "<p>".substr(strip_tags($row['webDescripcion']), 0, 255)."...</p>";
  10.         }  
  11.    echo "</div>";
  12.    echo "</div>";;

Y este es el código CSS:

Código CSS:
Ver original
  1. #Resultados {
  2.    margin:0 auto;
  3.    width: 650px;
  4. }
  5. #Anuncios {
  6.    float: left;
  7.    width: 150px;
  8. }
  9. #Estructura{
  10.    overflow: hidden;
  11.    width: auto;
  12. }

Solo logro centrar los resultados, pero los anuncios no pueden mostrarse bien, cuando intento mostrarlos a la izquierda se superponen con los resultados y no se entiende nada.

¿como puedo lograr que los resultados se vean en el centro, y que a la izquierda aparezca el anuncio?

Algo así como hace Google, que muestra los resultados en el centro, y en la columna izquierda se ven las herramientas de búsqueda algunas veces.

Saludos y gracias!
  #2 (permalink)  
Antiguo 26/04/2013, 21:29
 
Fecha de Ingreso: enero-2012
Ubicación: <?php echo"Los teques"; ?>/////estado miranda
Mensajes: 196
Antigüedad: 9 años, 4 meses
Puntos: 9
Respuesta: Divs para resultados Mysql

Prueba creando una tabla, y eliminando en codigo CSS.
  #3 (permalink)  
Antiguo 27/04/2013, 01:24
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.485
Antigüedad: 18 años, 10 meses
Puntos: 2113
Respuesta: Divs para resultados Mysql

Bueno, el comentario de omarinfinito vamos hacer como que no existe...

En realidad sólo tienes que flotar los elementos que quieras tener uno al lado del otro. Como haz hecho el truquito del overflow, entonces lo suyo sería reordenar el HTML y poner los anuncios después de los resultados y deberían de salir como esperas.
  #4 (permalink)  
Antiguo 27/04/2013, 16:32
Avatar de xarmagedonx  
Fecha de Ingreso: marzo-2009
Mensajes: 360
Antigüedad: 12 años, 3 meses
Puntos: 29
Respuesta: Divs para resultados Mysql

jaja Hola Pzin gracias por la respuesta, coloque el div "Anuncios" luego de los resultados, pero no aparece a la izquierda exactamente.

A la hora de mostrar el anuncio este aparece luego de los resultados, como abajo a la izquierda, por lo que uno tendria que llegar al final de los resultados para poder verlo.

Saludos!!!
  #5 (permalink)  
Antiguo 28/04/2013, 03:23
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.485
Antigüedad: 18 años, 10 meses
Puntos: 2113
Respuesta: Divs para resultados Mysql

Creo que no te había entendido, o entendí lo que no era.

A ver si esto es lo que buscabas:

Código CSS:
Ver original
  1. #Resultados {
  2.   overflow: hidden;
  3. }
  4.  
  5. #Anuncios {
  6.   float: left;
  7.   width: 150px;
  8. }
  9. #Estructura{
  10.   overflow: hidden;
  11. }

En #Estructura no hay que indicar width: auto, ya que los elementos de bloque tienen todos un ancho automático por defecto. Y lo del margen automática para #Resultados tampoco hace falta ya que no buscas centrarlo.
  #6 (permalink)  
Antiguo 28/04/2013, 08:10
Avatar de xarmagedonx  
Fecha de Ingreso: marzo-2009
Mensajes: 360
Antigüedad: 12 años, 3 meses
Puntos: 29
Respuesta: Divs para resultados Mysql

Hola, gracias por responder, de momento edite el codigo desde el celular y funciona perfectamente con un texto, gracias!!!

Me queda una duda, si en vez de texto coloco una imagen que supere los 150px ¿que sucedería?

Muchas gracias por la ayuda
  #7 (permalink)  
Antiguo 28/04/2013, 08:57
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.485
Antigüedad: 18 años, 10 meses
Puntos: 2113
Respuesta: Divs para resultados Mysql

Cita:
Iniciado por xarmagedonx Ver Mensaje
Me queda una duda, si en vez de texto coloco una imagen que supere los 150px ¿que sucedería?
Supongo que empujaría los primeros resultados hacia la derecha. De todas formas puedes especificar un tamaño máximo para las imagenes que estén dentro de #Anuncios:

Código CSS:
Ver original
  1. #Anuncios img {
  2.   max-width: 150px;
  3. }

O aún mejor, por si algún día cambias el tamaño de #Anuncios:

Código CSS:
Ver original
  1. #Anuncios img {
  2.   max-width: 100%;
  3. }

Así no tendrías que ir mirando las medidas.

La altura se adaptaría en ambos casos, es decir, no hay riesgo de que se deforme la imagen.

Etiquetas: css, divs, google, mysql, resultados
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:58.