Foros del Web » Creando para Internet » CSS »

Eliminar espacio

 Estas en el tema de Eliminar espacio en el foro de CSS en Foros del Web. hola: se me plantea el siguiente problema; quiero eliminar el espacio blanco encima del menu: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código CSS: Ver original /* Reset code to ...
  #1 (permalink)  
Antiguo 17/10/2013, 04:17
 
Fecha de Ingreso: abril-2008
Mensajes: 348
Antigüedad: 16 años, 8 meses
Puntos: 1
Eliminar espacio
hola:

se me plantea el siguiente problema; quiero eliminar el espacio blanco encima del menu:



Código CSS: 
Ver original
  1. /* Reset code to remove theme inherent styling */
  2. .dcjq-mega-menu ul.menu ul, .dcjq-mega-menu ul.menu li {
  3. list-style: none; 
  4. padding: 0; 
  5. margin: 0;
  6. }
  7. .dcjq-mega-menu ul.menu ul {
  8. display: none; /* Hides non-mega links */
  9. }
  10. .dcjq-mega-menu ul.menu .sub ul {
  11. display: block; /* overrides above hide */
  12. }
  13.  
  14. /* Main menu styles */
  15. .dcjq-mega-menu ul.menu {
  16.     width: 100%;
  17.     height: 40px;
  18.     border-right: 1px solid #1B1B1B;
  19.     border-left: 1px solid #1B1B1B;
  20.     position: relative; /* Important - required for positioning of mega menu */
  21.     font: normal 13px Arial, sans-serif;
  22.     
  23.     background-color: #222;
  24.     background-image: url(images/bg_black.png);
  25.     background-repeat: repeat-x;
  26.     background-position: 0 -80px;
  27. }
  28. .dcjq-mega-menu ul.menu li {
  29. float: left; 
  30. font-weight: bold;
  31. }
  32. .dcjq-mega-menu ul.menu li a {
  33. float: left; 
  34. display: block;  
  35. padding: 12px 25px; 
  36. background: url(images/bg_black.png) repeat-x 100% 0; 
  37. color: #fff;
  38. text-shadow: 1px 1px 1px #000; 
  39. text-decoration: none;
  40. }
  41. .dcjq-mega-menu ul.menu li.mega-hover a, .dcjq-mega-menu ul.menu li a:hover {
  42. background-position: 100% -40px; 
  43. color: #000; 
  44. text-shadow: none;
  45. }
  46.  
  47. /* Arrow tag for parent links */
  48. .dcjq-mega-menu ul.menu li a.dc-mega {
  49. padding-right: 38px; /* Additional padding for arrow */
  50. position: relative; /* Required for arrow positioning */
  51. }
  52. .dcjq-mega-menu ul.menu li a .dc-mega-icon {
  53. display: block; 
  54. position: absolute; 
  55. top: 18px; 
  56. right: 15px; 
  57. width: 8px; 
  58. height: 6px; 
  59. background: url(images/arrow.png) no-repeat 0 0;
  60. }
  61. .dcjq-mega-menu ul.menu li.mega-hover a .dc-mega-icon {
  62. background-position: 0 100%;
  63. }
  64.  
  65. /* Mega Menu Styling */
  66. /* Mega Drop Down Container */
  67. .dcjq-mega-menu ul.menu li .sub-container {
  68. position: absolute; /* Required */
  69. background: url(images/bg_sub_left.png) no-repeat 0 100%; 
  70. padding-left: 10px; 
  71. margin-left: -3px;
  72. }
  73. .dcjq-mega-menu ul.menu li .sub {
  74. background: url(images/bg_sub.png) no-repeat 100% 100%; 
  75. padding: 20px 20px 20px 10px;
  76. }
  77. .dcjq-mega-menu ul.menu li .sub-container.mega .sub {
  78. padding: 20px 10px 0 0;
  79. }
  80. .dcjq-mega-menu ul.menu li .sub .row { /* Clear the sub-menu floats */
  81. width: 100%; 
  82. overflow: hidden; 
  83. clear: both;
  84. }
  85. .dcjq-mega-menu ul.menu li .sub li {
  86. float: none; 
  87. font-size: 1em; 
  88. font-weight: bold;
  89. }
  90. /* Sub-menu Headers */
  91. .dcjq-mega-menu ul.menu li .sub li.mega-hdr { /* Sub-menu headers - i.e. 2nd level navigation */
  92. float: left; /* Float the sub-menus and give them a fixed width to from the mega menu rows */
  93. width: 260px;
  94. margin: 0 10px 20px 10px;
  95. border: 1px solid #ccc; 
  96. }
  97. .dcjq-mega-menu ul.menu li .sub a { /* Clear the styles from the top-level links and set the font styles */
  98. background: none; 
  99. border: none; 
  100. text-shadow: none; 
  101. color: #111; 
  102. padding: 7px 10px; 
  103. display: block; 
  104. float: none; 
  105. text-decoration: none; 
  106. font-size: 0.9em; 
  107. }
  108. .dcjq-mega-menu ul.menu li .sub li.mega-hdr a.mega-hdr-a {
  109. padding: 7px 10px; 
  110. margin-bottom: 5px; 
  111. border-bottom: 1px solid #ccc; 
  112. text-transform: uppercase; 
  113. font-weight: bold; 
  114. color: #000; 
  115. background: #EAEAEA url(images/bg_hdr.png) repeat-x center center;
  116. }
  117. .dcjq-mega-menu ul.menu li .sub li.mega-hdr a.mega-hdr-a:hover {
  118. color: #000; 
  119. text-shadow: none;
  120. }
  121.  
  122.  
  123. /* Add the individual sub-menu backgrounds */
  124. .dcjq-mega-menu ul.menu li .sub li#menu-item-1 {
  125. background: url(images/bg_coupe.jpg) no-repeat 135px 40px;
  126. }
  127. .dcjq-mega-menu ul.menu li .sub li#menu-item-2 {
  128. background: url(images/bg_sedan.jpg) no-repeat 135px 40px;
  129. }
  130. .dcjq-mega-menu ul.menu li .sub li#menu-item-3 {
  131. background: url(images/bg_convert.jpg) no-repeat 135px 40px;
  132. }
  133. .dcjq-mega-menu ul.menu li .sub li#menu-item-4 {
  134. background: url(images/bg_suv.jpg) no-repeat 135px 40px;
  135. }
  136. .dcjq-mega-menu ul.menu li .sub li#menu-item-5 {
  137. background: url(images/bg_pickup.jpg) no-repeat 135px 40px;
  138. }
  139. .dcjq-mega-menu ul.menu li .sub li#menu-item-6 {
  140. background: url(images/bg_sports.jpg) no-repeat 135px 40px;
  141. }
  142.  
  143. /* Style the 3rd level links */
  144. .dcjq-mega-menu ul.menu li .sub li ul li {
  145. margin-right: 90px;
  146. }
  147. .dcjq-mega-menu ul.menu .sub li.mega-hdr li a {
  148. color: #444;
  149. font-weight: normal; 
  150. padding: 3px 0 3px 25px; 
  151. background: url(images/bullet.png) no-repeat 10px 8px; 
  152. }
  153. .dcjq-mega-menu ul.menu .sub li.mega-hdr li a:hover {
  154. color: #990000;
  155. background-image: url(images/bullet_on.png); 
  156. }
  157.  
  158. /* Styling for items with only 2 levels */
  159. .dcjq-mega-menu ul.menu li .sub-container.non-mega .sub {
  160. padding: 20px 20px 20px 10px;
  161. }
  162. .dcjq-mega-menu ul.menu li .sub-container.non-mega li {
  163. width: 190px; /* Set the drop down width */
  164. }
  165. .dcjq-mega-menu ul.menu li .sub-container.non-mega li a {
  166. padding: 7px 5px 7px 22px; 
  167. background: url(images/bullet.png) no-repeat 5px 12px;
  168. }
  169. .dcjq-mega-menu ul.menu li .sub-container.non-mega li a:hover {
  170. color: #990000;
  171. background-image: url(images/bullet_on.png);
  172. }

gracias por vuestra ayuda
Última edición por pzin; 17/10/2013 a las 05:24 Razón: formato código
  #2 (permalink)  
Antiguo 17/10/2013, 05:25
Avatar de pzin
Moderata 😈
  
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 4 meses
Puntos: 2114
Respuesta: Eliminar espacio
Pon por lo menos el HTML, para saber qué es cada cosa.
  #3 (permalink)  
Antiguo 17/10/2013, 05:39
 
Fecha de Ingreso: abril-2008
Mensajes: 348
Antigüedad: 16 años, 8 meses
Puntos: 1
Respuesta: Eliminar espacio
perdon¡¡¡

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta name="robots" content="all" />
  6. <title>jQuery Mega Drop Down Menu Plugin Sample Styling</title>
  7. <link href="css/dcmegamenu.css" rel="stylesheet" type="text/css" />
  8. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  9. <script type='text/javascript' src='js/jquery.hoverIntent.minified.js'></script>
  10. <script type='text/javascript' src='js/jquery.dcmegamenu.1.2.js'></script>
  11. <script type="text/javascript">
  12. $(document).ready(function($){
  13.     $('#mega-menu-tut').dcMegaMenu({
  14.         rowItems: '3',
  15.         speed: 'fast'
  16.     });
  17. });
  18. </script>
  19. <link href="menu.css" rel="stylesheet" type="text/css" />
  20. <style>
  21. /* Demo Styles */
  22. .wrap {width: 960px; margin: 0 auto;}
  23. </style>
  24. </head>
  25. <body>
  26. <div class="wrap">
  27. <h2>jQuery Mega Drop Down Menu Plugin Sample Styling - <a href="http://www.designchemical.com/blog/index.php/wordpress-plugins/wordpress-plugin-jquery-drop-down-mega-menu-widget/">Visit Plugin Site</a></h2>
  28. <div class="dcjq-mega-menu">
  29. <ul id="mega-menu-tut" class="menu">
  30.     <li><a href="#">Home</a></li>
  31.     <li><a href="#">Vehicles</a>
  32.         <ul>
  33.             <li id="menu-item-1"><a href="#">Coupe</a>
  34.                 <ul>
  35.                     <li><a href="#">Citroen C4</a></li>
  36.                     <li><a href="#">Honda CR-Z</a></li>
  37.                     <li><a href="#">BMW 3 Series</a></li>
  38.                     <li><a href="#">Volvo C30</a></li>
  39.                 </ul>
  40.             </li>
  41.             <li id="menu-item-2"><a href="#">Saloon</a>
  42.                 <ul>
  43.                     
  44.                     <li><a href="#">Volkswagen Passat</a></li>
  45.                     <li><a href="#">Volvo S40</a></li>
  46.                     <li><a href="#">Vauxhall Insignia</a></li>
  47.                     <li><a href="#">Mitsubishi Lancer</a></li>
  48.                     
  49.                 </ul>
  50.             </li>
  51.             <li id="menu-item-3"><a href="#">Convertibles</a>
  52.                 <ul>
  53.                     
  54.                     <li><a href="#">Mini Convertible</a></li>
  55.                     <li><a href="#">Renault Megane CC</a></li>
  56.                     <li><a href="#">Peugeot 207 CC</a></li>
  57.                     <li><a href="#">Volkswagen Eos</a></li>
  58.                     
  59.                 </ul>
  60.             </li>
  61.             <li id="menu-item-4"><a href="#">SUV's</a>
  62.                 <ul>
  63.                     
  64.                     <li><a href="#">Land Rover Freelander 2</a></li>
  65.                     <li><a href="#">Audi Q5</a></li>
  66.                     <li><a href="#">Land Rover Discovery 3</a></li>
  67.                     <li><a href="#">Volvo XC90</a></li>
  68.                     
  69.                 </ul>
  70.             </li>
  71.             <li id="menu-item-5"><a href="#">Pickups</a>
  72.                 <ul>
  73.                     <li><a href="#">Suzuki Equator</a></li>
  74.                     <li><a href="#">Ford F-150</a></li>
  75.                     <li><a href="#">Toyota Tacoma</a></li>
  76.                     <li><a href="#">Nissan Frontier</a></li>
  77.                     
  78.                 </ul>
  79.             </li>
  80.             <li id="menu-item-6"><a href="#">High Performance Cars</a>
  81.                 <ul>
  82.                     <li><a href="#">Lamborghini Gallardo</a></li>
  83.                     <li><a href="#">Ferrari F430</a></li>
  84.                     <li><a href="#">Aston Martin Vantage</a></li>
  85.                     <li><a href="#">Porsche 911 Turbo</a></li>
  86.                     
  87.                 </ul>
  88.             </li>
  89.             
  90.         </ul>
  91.     </li>
  92.     
  93. <li><a href="#">About Us</a>
  94.   <ul><li><a href="#">About Us</a></li><li><a href="#">About Us</a></li>
  95.   </ul></li>
  96. <li><a href="#">Services</a></li>
  97. <li><a href="#">Contact us</a></li>
  98. </ul>
  99. </div>
  100. <div style="height: 350px;"></div>
  101. </body>
  102. </html>
  #4 (permalink)  
Antiguo 17/10/2013, 10:04
Avatar de hackjose  
Fecha de Ingreso: abril-2010
Ubicación: Edo Mexico
Mensajes: 1.178
Antigüedad: 14 años, 8 meses
Puntos: 131
Respuesta: Eliminar espacio
De alguna forma poniendo esto
*
{
margin:0;
padding:0;
}
la cosa queda

saludos
  #5 (permalink)  
Antiguo 17/10/2013, 10:17
 
Fecha de Ingreso: abril-2008
Mensajes: 348
Antigüedad: 16 años, 8 meses
Puntos: 1
Respuesta: Eliminar espacio
Fantastico, funciona¡¡¡

mil gracias

Etiquetas: background, color, espacio, hover
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


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 17:02.