Foros del Web » Creando para Internet » CSS »

Problema con menú

Estas en el tema de Problema con menú en el foro de CSS en Foros del Web. Buenas, Estoy preparando un menú desplegable pero me encontré con un error: Tengo la siguiente css: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código CSS: Ver original #headbox a { ...
  #1 (permalink)  
Antiguo 24/08/2011, 07:56
 
Fecha de Ingreso: noviembre-2010
Mensajes: 1.242
Antigüedad: 13 años, 5 meses
Puntos: 73
Problema con menú

Buenas,

Estoy preparando un menú desplegable pero me encontré con un error:

Tengo la siguiente css:

Código CSS:
Ver original
  1. #headbox a {
  2. color: #11C;
  3. text-decoration: none;
  4. }
  5.  
  6. #headbox{
  7. background-color: #2D2D2D;
  8. border-bottom: 1px solid black;
  9. font-size: 24px;
  10. height: 29px;
  11. opacity: 1;
  12. filter: alpha(opacity=100);
  13. position: absolute;
  14. top: 0;
  15. width: 100%;
  16. z-index: 0;
  17. right: 0;
  18. }
  19.  
  20. #cabecera{
  21. background-image: -moz-linear-gradient(top, #416D99, #2C5687);
  22. background-image: -webkit-gradient(linear, center top, center bottom, from(#416D99), to(#2C5687));
  23. border-bottom: 2px solid #E5E5E5;
  24. border-top:1px solid #4F84AF;
  25. font-size: 24px;
  26. height: 65px;
  27. position: absolute;
  28. width: 100%;
  29. margin: 22px auto;
  30. right: 0px;
  31. left: 0px;
  32. z-index: -1;
  33. }
  34.  
  35.  
  36.  
  37. #headbox .gbtcb {
  38. position: absolute;
  39. visibility: hidden;
  40. }
  41.  
  42. .gbtc, .gbmc, .gbmcc {
  43. display: block;
  44. list-style: none;
  45. margin: 0;
  46. padding: 0;
  47. width: 235px;
  48. }
  49.  
  50. .gbtc, .gbmc, .gbmcc {
  51. list-style: none;
  52. }
  53.  
  54. .gbt {
  55.     position: relative;
  56.     display: -moz-inline-box;
  57.     display: inline-block;
  58.     line-height: 27px;
  59.     padding: 0 0 0 10px;
  60.     vertical-align: top;
  61.     background: #2D2D2D!important;
  62.     visibility: visible;
  63. }
  64.  
  65. .gbt42 {
  66. background: white;
  67. position: relative;
  68. display: -moz-inline-box;
  69. display: inline-block;
  70. line-height: 27px;
  71. padding: 0 0 0 10px;
  72. vertical-align: top;
  73. box-shadow: 0px 5px 10px #ccc;
  74. -moz-box-shadow: 0px 5px 10px #ccc;
  75. -webkit-box-shadow: 0px 5px 10px #ccc;
  76. }
  77.  
  78. .gbzt, .gbgt {
  79. cursor: pointer;
  80. display: block;
  81. text-decoration: none !important;
  82. }
  83.  
  84. .gbts {
  85. border-left: 1px solid transparent;
  86. border-right: 1px solid transparent;
  87. display: block;
  88. padding: 1px 3px 0px 2px;
  89. position: relative;
  90. z-index: 1000;
  91. font-size: 15px;
  92. left: -7px;
  93. }
  94.  
  95.  
  96.  
  97.  
  98.  
  99. #headbox .center {
  100. margin: 0 auto;
  101. width: 1045px;
  102. height: 30px;
  103. }
  104.  
  105. #headbox .gbtb2 {
  106. display: block;
  107. border-top: 2px solid transparent;
  108. }
  109.  
  110. #gbz .gbzt, #gbz .gbgt,#gbz2 .gbzt, #gbz2 .gbgt, #gbg .gbgt {
  111. color: #225985!important;
  112. background: transparent;
  113. }
  114.  
  115. #gbz ul.gbtc li.active {
  116. border-top: 2px solid #DD4B39;
  117. }
  118.  
  119. .gbzt-hvr, .gbzt:focus, .gbgt-hvr, .gbgt:focus {
  120. background-color: #4C4C4C;
  121. background-image: none;
  122. background-position: 0 -102px;
  123. background-repeat: repeat-x;
  124. outline: none;
  125. text-decoration: none !important;
  126. }
  127.  
  128. #gbg6.gbgt-hvr,#gbg6.gbgt:focus
  129. {background-color:transparent;background-image:none}
  130.  
  131. #gbg {
  132. float: right;
  133. position: relative;
  134. padding-right: 5px;
  135. }
  136.  
  137. #gbg ul li ul{
  138. position: absolute;
  139. border: 1px solid #C3D1EC;
  140. box-shadow: 0 1px 5px #CCCCCC;
  141. margin-top: -1px;
  142. display: none;
  143. padding: 0px 16px 0px 0;
  144. }
  145.  
  146. .gbtsa {
  147. padding-right: 9px;
  148. }
  149.  
  150.  
  151. .gbma {
  152. position: relative;
  153. top: -1px;
  154. border-style: solid dashed dashed;
  155. border-color: transparent;
  156. border-top-color: silver;
  157. display: -moz-inline-box;
  158. display: inline-block;
  159. font-size: 0;
  160. height: 0;
  161. line-height: 0;
  162. width: 0;
  163. border-width: 3px 3px 0;
  164. padding-top: 1px;
  165. left: 4px;
  166. }
  167.  
  168.  
  169. #headbox .nav_list {
  170. color: #36C;
  171. list-style: none;
  172. top: -23px;
  173. position: relative;
  174. border: 1px solid #BEBEBE;
  175. background: white;
  176. -moz-box-shadow: 0px 3px 3px 0px #CCC;
  177. -webkit-box-shadow: 0px 3px 3px 0px #CCC;
  178. z-index: 2;
  179. zoom: 1;
  180. padding: 4px 0px;
  181. left: -36px;
  182. width: 230px;
  183. }
  184. #headbox .name_user {
  185. color: black;
  186. font-weight: bold;
  187. font-size:small;
  188. left:65px;
  189. top: 7px;
  190. position: relative;
  191. color: #36C;
  192. display: block;
  193. }
  194. #headbox .name_rango {
  195. color: #5A5A5A;
  196. display: block;
  197. font-size: 13px;
  198. left: 65px;
  199. position: relative;
  200. display: block;
  201. }
  202.  
  203. #headbox .image_user {
  204. display: block;
  205. padding-left: 5px;
  206. padding-top: 10px;
  207. position: absolute;
  208. }
  209.  
  210. .gbmtc {
  211. padding: 0;
  212. margin: 0;
  213. line-height: 27px;
  214. left: -10px;
  215. position: relative;
  216. }
  217. .gbml1 {
  218. display: inline-block;
  219. margin: 0 15px;
  220. padding: 0 10px;
  221. }
  222.  
  223. .gbmh {
  224. border-top: 1px solid #E5E5E5;
  225. font-size: 0;
  226. margin: 10px 0;
  227. }
  228.  
  229. #gb {
  230. font: 13px/27px Arial,sans-serif;
  231. }
  232.  
  233. .gbmt, .gbml1, .gbmt:visited, .gbml1:visited {
  234. color: #36C !important;
  235. display:-webkit-box;
  236. text-decoration: none !important;
  237. font-size: small;
  238. background: #FFF;
  239. }
  240.  
  241.  
  242. .gbmt:hover,.gbml1:hover {
  243. background: #EFF3FB;
  244. outline: none;
  245. }



El problema es que con la div que tiene el contenido no se muestra el menú, se muestra por detrás del contenido y debería verse por delante.

Necesito poner una div que se vea sobre todas las demás.

No tengo mucha idea de diseño, es por eso que pregunto
__________________
:)
  #2 (permalink)  
Antiguo 24/08/2011, 09:30
Avatar de Batan  
Fecha de Ingreso: septiembre-2010
Ubicación: Madrid
Mensajes: 408
Antigüedad: 13 años, 7 meses
Puntos: 63
Respuesta: Problema con menú

Buenas, no veo la linea de tu menu, pero de todas formas con z-index puedes hacer que un elemento se sobreponga sobre los demas.

Más

Saludos

Etiquetas: contenido, menú, 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 12:59.