Como mostrar resultado de buscador sobre el contenido ya existente en pagina

[Rasec101]

Buenas tardes estoy trabajando en un buscador tipo Facebook, El cual me funciona casi perfecto. El único problema que tengo que al momento de realizar la búsqueda, me muestra las opciones pero me desplaza el contenido de mi pagina hacia abajo. Lo que necesito es sobre exponerlo los resultados del buscador sobre el contenido ya existente en mi pagina sin que me desplacé el contenido ya existente no sé si abra alguna forma de resolverlo con CSS. De ante mano muchas gracias

[pzin]

Tendrías que crear un elemento que haga de contenedor, y ponerlo una posición relativa con position: relative; donde quieres que aparezcan los resultados de la búsqueda y luego otro elemento en su interior con una posición absoluta, indicando position: absolute.

Al estar fuera del flujo natural del HTML, no va a afectar en los elementos que le sigan.

Adicionalmente seguramente necesites también indicar z-index: 100 para superponer dicho elemento encima de los demás.

[Rasec101]

gracias pzin por responder tan rápido mira dentro de este div se cargan los resultados del buscador

Código HTML:

<div align="left">
<img src="images/<?php echo $img; ?>" style="width:50px; float:left; margin-right:6px" /><?php echo $nombreFinal ; ?>&nbsp;<?php echo $apeFinal ; ?><br/>
<span style="font-size:11px; color:#999999"><?php echo $ciudad; ?></span><br/>
<span style="font-size:9px; color:#9999ff"><?php echo "Amigos en com&uacute;n:".$amigos; ?></span>
</div>
 

no sé si me puedes orientar un poco con este tema ya que mis conocimientos de css son un poco limitados

[pzin]

No sé en cuales de esos elementos se supone que aparecen los resultados.

Pero la cosa, sería hacer algo así:

Código HTML:

<div id="buscar">
  Aquí pones el formulario y todo lo que necesites
  <div id="resultados"></div>
</div>
 

Y luego en el CSS hacer lo que te comenté arriba:

Código CSS:

div#buscar {
  position: relative;
}
 
div#resultados {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
}
 

Así tendrían que aparecer los resultados justo debajo del div#buscar.

[Rasec101]

Muchas gracias es exactamente lo que buscaba.