Ver Mensaje Individual
  #8 (permalink)  
Antiguo 29/03/2013, 06:01
Avatar de temerariomalaga
temerariomalaga
 
Fecha de Ingreso: marzo-2013
Ubicación: Londres
Mensajes: 156
Antigüedad: 11 años, 8 meses
Puntos: 9
Respuesta: Problema con posicionamiento fijo

Pues he hecho de paso una modificación del estilo. He puesto que el color del menú ocupe todo el ancho y así me quito el problema del cambio de contrastes del fondo.
Pues eso solucionado. Ya que tengo este hilo abierto aprovecho y pongo otro problemilla que tengo. Tengo un div flotante para poner las novedades. El div tiene un parrafo con un id para identificar que es la cabecera. Pues bien, al desplazar la página hacia abajo la cabecera se me queda fija y el div se me desplaza hacia arriba con el resto de la página. Eso es por el posicionamiento fijo. El problema está en que al quitarlre el posicionamiento fijo al desplazar el scroll de las noticias, la cabecera se va, y si pongo el div como fijo con 0px a la derecha el texto de la página se mete dentro del div flotante. ¿hay alguna solución para que no se me mueva la cabecera del div?
El html y el css son los siguientes:
Código HTML:
Ver original
  1. <div id="text">
  2.             <div id="notice">
  3.                 <p id="cabecera">Novedades</p>
  4.                 <!--<p class="noticia"><img src="images/arrow.jpg"/>En la sección de contacto encontrará un formulario que puede rellenar para realizar cualquier pregunta o solicitar su clave de descarga.<br><span class="fecha"> Publicado el 30/03/13</span></p>
  5.                 <p class="noticia"><img src="images/arrow.jpg"/>Nueva página!! Ahora podrá acceder desde la siguiente dirección: <a href="http://representacionessuviri.t15.org/">representacionessuviri.t15.org</a><br><span class="fecha"> Publicado el 30/03/13</span></p>-->
  6.                 <p class="noticia"><img src="images/arrow.jpg"/>El día 30 de marzo se procederá a cambiar el servidor de la web, cambiando también su dirección. Más noticias el día 30.<br><span class="fecha"> Publicado el 28/03/13</span></p>
  7.                 <p class="noticia"><img src="images/arrow.jpg"/>Ya está disponible el catálogo de Rovimat de 2013. Búsquelo en la sección de descargas y no olvide solicitar su clave.<br><span class="fecha"> Publicado el 28/03/13</span></p>
  8.                 <p class="noticia"><img src="images/arrow.jpg"/>Próximamente la web cambiará de dirección, permanezca atento al tablón de novedades.<br><span class="fecha"> Publicado el 27/03/13</span></p>
  9.                 <p class="noticia"><img src="images/arrow.jpg"/>En esta sección podrá ver las novedades referentes a la web.<br><span class="fecha"> Publicado el 27/03/13</span></p>
  10.             </div>
Código CSS:
Ver original
  1. #notice{
  2.     float: right;
  3.     border: 3px solid #CC6600;
  4.     height: 300px;
  5.     width: 300px;
  6.     overflow:auto;
  7.     position: fixed right;
  8. #cabecera{
  9.     background-color: #CC6600;
  10.     margin-top: -3px;
  11.     position: fixed;
  12.     width: inherit;
  13.     }
__________________
Málaga Club de Fútbol: Memoria, Compromiso, Fe

Última edición por temerariomalaga; 29/03/2013 a las 06:04 Razón: se me olvido el código