Foros del Web » Creando para Internet » CSS »

elementos flotantes y fondo

Estas en el tema de elementos flotantes y fondo en el foro de CSS en Foros del Web. para que al hacer un menu transparente no suceda esto, que debo hacer? mi css es este @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código CSS: Ver original #menul { ...
  #1 (permalink)  
Antiguo 02/06/2010, 19:55
 
Fecha de Ingreso: abril-2010
Ubicación: Chile
Mensajes: 76
Antigüedad: 7 años, 8 meses
Puntos: 3
elementos flotantes y fondo

para que al hacer un menu transparente no suceda esto, que debo hacer?


mi css es este
Código CSS:
Ver original
  1. #menul {
  2. float: left;
  3. width: 25px;
  4. height: 55px;
  5. background: url('images/mbar_l.png') no-repeat;
  6. }
  7. #menur {
  8. float: right;
  9. width: 25px;
  10. height: 55px;
  11. background: url('images/mbar_r.png') no-repeat;
  12. }
  13. #menum {
  14. width: 100%;
  15. height: 55px;
  16. background: url('images/mbar_m.png') repeat-x;
  17. }

y el html
Código HTML:
Ver original
  1. <div id="menul">
  2. </div>
  3. <div id="menur">
  4. </div>
  5. <div id="menum">
  6. </div>
  #2 (permalink)  
Antiguo 03/06/2010, 10:40
 
Fecha de Ingreso: abril-2010
Ubicación: Chile
Mensajes: 76
Antigüedad: 7 años, 8 meses
Puntos: 3
Respuesta: elementos flotantes y fondo

¿nadie? por favor alguien que me ayude con esto
  #3 (permalink)  
Antiguo 03/06/2010, 13:35
 
Fecha de Ingreso: junio-2010
Mensajes: 8
Antigüedad: 7 años, 6 meses
Puntos: 0
Respuesta: elementos flotantes y fondo

Hola
Comprueba que las imágenes las has exportado en png con transparecia alpha
  #4 (permalink)  
Antiguo 03/06/2010, 15:05
 
Fecha de Ingreso: abril-2010
Ubicación: Chile
Mensajes: 76
Antigüedad: 7 años, 8 meses
Puntos: 3
Respuesta: elementos flotantes y fondo

como hago eso en photoshop?
  #5 (permalink)  
Antiguo 03/06/2010, 19:20
 
Fecha de Ingreso: junio-2010
Mensajes: 8
Antigüedad: 7 años, 6 meses
Puntos: 0
Respuesta: elementos flotantes y fondo

Das a guardar como dispositivo web y eliges la opción png-8 y con que esté pinchada la opción de transparencia lo tienes
  #6 (permalink)  
Antiguo 03/06/2010, 21:47
 
Fecha de Ingreso: abril-2010
Ubicación: Chile
Mensajes: 76
Antigüedad: 7 años, 8 meses
Puntos: 3
Respuesta: elementos flotantes y fondo

aun asi no se soluciona
quiero que sea asi


como ves, donde esta marcado rojo, el elemento menum interfiere con menul, y eso no quiero que pase, tanto en la izq como en la derecha, porque si coloco un margin: 0 25px; por ejemplo, desaparece solo en la izq, pero en la derecha sigue habiendo esa interferencia
  #7 (permalink)  
Antiguo 03/06/2010, 22:37
Avatar de dots3r  
Fecha de Ingreso: julio-2008
Mensajes: 106
Antigüedad: 9 años, 4 meses
Puntos: 5
Respuesta: elementos flotantes y fondo

Eso pasa porque los contenedores que tiene las imágenes de la orilla están flotando y por consiguiente el contenedor del fondo tiende a ocupar su lugar. Prueba flotar el contenedor del fondo y reducir un poco si tamaño.
  #8 (permalink)  
Antiguo 04/06/2010, 02:15
 
Fecha de Ingreso: abril-2010
Ubicación: Chile
Mensajes: 76
Antigüedad: 7 años, 8 meses
Puntos: 3
Respuesta: elementos flotantes y fondo

no, no funciona eso de flotar la imagen del medio, qe otra cosa podria hacer?
  #9 (permalink)  
Antiguo 04/06/2010, 05:39
 
Fecha de Ingreso: junio-2010
Mensajes: 8
Antigüedad: 7 años, 6 meses
Puntos: 0
Respuesta: elementos flotantes y fondo

Creo que no lo estás plantando bien. Pero igual te suelto un rollo y no he entendido lo que quiers hacer, pero te cuento.

Imagino que esa imagen es la imagen de fondo del menú, no???

Pues yo lo plantearía así. Yo no soy dada a tanto div, así que los menús los hago con listas. Sólo necesitas una imagen de fondo para todo el menú y luego cada apartado del menu con otra, si es que vas a usar una tipografía en imagen.

Bueno, como me explico como un libro abierto, casi mejor te paso un ejemplo y así lo ves :)

Código HTML:
Ver original
  1. <ul id="menu03">
  2.   <li id="menu3_ini"><a href="#">inicio</a></li>
  3.   <li id="menu3_pro"><a href="#">productos</a></li>
  4.   <li id="menu3_eje"><a href="#"> ejemplos</a></li>
  5.   <li id="menu3_ayu"><a href="#"> ayuda</a></li>
  6.   <li id="menu3_con"><a href="#">contacto</a></li>
  7. </ul>

Código CSS:
Ver original
  1. #menu03 {
  2.     background-image: url;
  3.     width: 960px;
  4.     float: left;
  5. }
  6. #menu03 li {
  7.     float: left;
  8. }
  9. #menu03 li a {
  10.     line-height: 2.5;
  11.     color: #FFF;
  12.     text-decoration: none;
  13.     float: left;
  14.     width: 191px;
  15.     text-align: center;
  16.     border-right-width: 1px;
  17.     border-right-style: solid;
  18.     border-right-color: #FFF;
  19. }
  20. #menu03 li a:hover {
  21.     background-color: #C9F;
  22. }

Espero que se solucionen tus problemas

Pero pon sólo una imagen de fondo con el tamaño del menu que quieras y luego juegas con los li, mejor que ir dando a cada div una imagen, vamos creo yo...

Etiquetas: elementos, flotantes, fondo
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 22:33.