Foros del Web » Creando para Internet » Diseño web »

problema con fondo de sitio web.

Estas en el tema de problema con fondo de sitio web. en el foro de Diseño web en Foros del Web. Hola a todos. Bueno el problema que tengo es que cree una pagina web y puse un div con una altura de 1650px donde va ...
  #1 (permalink)  
Antiguo 10/06/2014, 15:06
Avatar de Drewermerc  
Fecha de Ingreso: febrero-2014
Mensajes: 185
Antigüedad: 10 años, 9 meses
Puntos: 5
problema con fondo de sitio web.

Hola a todos.
Bueno el problema que tengo es que cree una pagina web y puse un div con una altura de 1650px donde va toda lo demas pero el problema que tengo es que cuando se termina ese div me queda un pedazo muy grande que es el color de fondo del body y quisiera saber como hacer que se quite o reduzca ese espacio que no ocupo.

Bueno espero que me puedan ayudar.
Saludos.
Drewermerc.
  #2 (permalink)  
Antiguo 11/06/2014, 03:55
 
Fecha de Ingreso: mayo-2013
Mensajes: 207
Antigüedad: 11 años, 6 meses
Puntos: 31
Respuesta: problema con fondo de sitio web.

Así, únicamente con la explicación, sólo se ocurre que sea cosa del margin.
  #3 (permalink)  
Antiguo 11/06/2014, 15:59
Avatar de Drewermerc  
Fecha de Ingreso: febrero-2014
Mensajes: 185
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: problema con fondo de sitio web.

Hola amigo.
gracias por responder pero no ya puse el body y html en 0 tanto margin como padding y sigue el hueco nose si tengas alguna otra solucion.

Saludos.
Drewermerc.
  #4 (permalink)  
Antiguo 12/06/2014, 00:16
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: problema con fondo de sitio web.

Si no pones el código es difícil de saber. Adivinar no es un arte exacto.
  #5 (permalink)  
Antiguo 12/06/2014, 19:13
Avatar de Drewermerc  
Fecha de Ingreso: febrero-2014
Mensajes: 185
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: problema con fondo de sitio web.

Bueno aqui les dejo el codigo espero que si me puedan ayudar.

Código CSS:
Ver original
  1. html{
  2. height=100%;
  3. width=100%;
  4. margin =0;
  5. padding =0;
  6. }
  7. div.titlewrapper, h1.title{
  8. font-size: 50px;
  9. width: 600px;
  10. height: 60px;
  11. margin-top: 15px;
  12. }
  13. div#lineaazul{
  14. width:301px;
  15. height:4px;
  16. background:#0E83B9;
  17. }
  18.  
  19. .tabs-widget li a {
  20.     color: #000;
  21.     display: block;
  22.     text-decoration: none;
  23.     background: none repeat scroll 0% 0% transparent;
  24.     font: 16px/12px 'Oswald',sans-serif;
  25.     padding: 15px 1px;
  26.     text-transform: uppercase;
  27. }
  28.  
  29. div.item-snippet{
  30.  
  31. color:#000;
  32. }
  33.  
  34. div.status-msg-body{
  35. color:#000;
  36. }
  37. div#titulo-principal{
  38. position:absolute;
  39. margin: 0 auto 0 auto;
  40. height:200px;
  41. width:960px;
  42. background-image:url(http://1.bp.blogspot.com/-Mx5qfSWsl0Y/U5Yw7oGy1DI/AAAAAAAAAOA/RjonipKZLRc/s0/titulo-blogger4.jpg);
  43. top: 0px;
  44. }
  45.  
  46. #header h1 a,#header h1 a:visited{
  47. color:#FEFEFE;
  48. text-decoration:none;
  49. visibility:hidden;
  50. }
  51.  
  52. #content-wrapper{
  53. background: none repeat scroll 0% 0% #FFF;
  54. padding: 15px;
  55.     width:930px;
  56.     height;800px;
  57. }
  58. #rsidebar-wrapper{
  59. width: 301px;
  60. position: relative;
  61. float: right;
  62. margin: 0px;
  63. padding: 0px 0px 0px 0px;
  64. word-wrap: break-word;
  65. margin-top: 20px;
  66. height: 1600px;
  67. }
  68.  
  69. #header h2{padding-left:5px;color:#FEFEFE;font:14px Arial,Helvetica,Sans-serif}
  70. #header2{
  71. position: absolute;
  72. margin: 0 auto 0 auto;
  73. width: 301px;
  74. top: -35px;
  75. }
  76. #header2 .widget{
  77. position: absolute;
  78. margin: 0 auto 0 auto;
  79. width: 301px;
  80. top: -36px;
  81. }
  82. #search{border:1px solid #535353;background:#393939 url(http://4.bp.blogspot.com/-rav0USyn9qk/USfxoawkPjI/AAAAAAAAD4s/kLYA28R1_0Y/s000/search.png) 99% 50% no-repeat;text-align:left;padding: 8px 150px 6px 6px;}
  83. #search #s{background:none;color:#979797;border:0;width:100%;padding:0;margin:0;outline:none}
  84.  
  85.  
  86.  
  87.  
  88. #body-wrapper{margin:0px;padding:0px;width: 95%;
  89. height: 100%;}
  90.  
  91. /* Header-----------------------------------------------*/
  92. #header-wrapper{width:960px;margin:0px auto 0px;height:62px;padding:20px 0px 20px 0px;overflow:hidden;}
  93. #header-inner{background-position:center;margin-left:auto;margin-right:auto}
  94. #header{margin:0;border:0 solid $bordercolor;color:$pagetitlecolor;float:left;width:60%;overflow:hidden;}
  95. #header h1{color:#FEFEFE;text-shadow:0px 1px 0px #000;margin:0 5px 0;padding:0px 0px 0px 0px;font-family:'Oswald',Arial,Helvetica,Sans-serif;font-weight:bold;font-size:32px;line-height:32px;}
  96. #header .description{padding-left:7px;color:#FEFEFE;text-shadow:0px 1px 0px #000;line-height:14px;font-size:14px;padding-top:0px;margin-top:10px;font-family:Arial,Helvetica,Sans-serif;}
  97.  
  98. div#sidebartab1{
  99. height:100px;
  100. }
  101. .tabviewsection{margin-top:10px;margin-bottom:10px;height:1000px}
  102.  
  103. body{background:#c2c2c2 center top no-repeat fixed;color:#E1E1E1;font-family: Arial, Helvetica, Sans-serif;font-size: 13px;margin:0px;padding:0px;height:300%;}
  104.  
  105. .toolbar{
  106. visibility:hidden;
  107. }
  108.  
  109.  
  110. .clearfix:after{content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden}
  111. #container,#header,#main,#main-fullwidth,#footer,.clearfix{display:block}
  112. .clear{clear:both}
  113. h1,h2,h3,h4,h5,h6{margin-bottom:16px;font-weight:normal;line-height:1}
  114. h1{font-size:40px}
  115. h2{font-size:30px}
  116. h3{font-size:20px}
  117. h4{font-size:16px}
  118. h5{font-size:14px}
  119. h6{font-size:12px}
  120. h1 img,h2 img,h3 img,h4 img,h5 img,h6 img{margin:0}
  121. table{margin-bottom:20px;width:100%}
  122. th{font-weight:bold}
  123.  
  124.  
  125.  
  126.  
  127.  
  128.  
  129.  
  130.  
  131.  
  132.  
  133.  
  134.  
  135.  
  136.  
  137. thead th{background:#c3d9ff}
  138. th,td,caption{padding:4px 10px 4px 5px}
  139. tr.even td{background:#e5ecf9}
  140. tfoot{font-style:italic}
  141. caption{background:#eee}
  142. li ul,li ol{margin:0}
  143. ul,ol{margin:0 20px 20px 0;padding-left:40px}
  144. ul{list-style-type:disc}
  145. ol{list-style-type:decimal}
  146. dl{margin:0 0 20px 0}
  147. dl dt{font-weight:bold}
  148. dd{margin-left:20px}
  149. blockquote{margin:20px;color:#666;}
  150. pre{margin:20px 0;white-space:pre}
  151. pre,code,tt{font:13px 'andale mono','lucida console',monospace;line-height:18px}
  152. #search {overflow:hidden;}
  153. #header h1{font-family:'Oswald',Arial,Helvetica,Sans-serif; font-size:60px}
  154. #header .description{font-family:Arial,Helvetica,Sans-serif;}
  155. .post-title {font-family:'Oswald',sans-serif;}
  156. .sidebar h2{font-family:'Oswald',sans-serif;}
  157. #footer-widgets .widgettitle{font-family:Arial,Helvetica,Sans-serif;}
  158. .menus,.menus *{margin:0;padding:0;list-style:none;list-style-type:none;line-height:1.0}
  159. .menus ul{position:absolute;top:-999em;width:100%}
  160. .menus ul li{width:100%}
  161. .menus li:hover{visibility:inherit}
  162. .menus li{float:left;position:relative}
  163. .menus a{display:block;position:relative}
  164. .menus li:hover ul,.menus li.sfHover ul{left:0;top:100%;z-index:99}
  165. .menus li:hover li ul,.menus li.sfHover li ul{top:-999em}
  166. .menus li li:hover ul,.menus li li.sfHover ul{left:100%;top:0}
  167. .menus li li:hover li ul,.menus li li.sfHover li ul{top:-999em}
  168. .menus li li li:hover ul,.menus li li li.sfHover ul{left:100%;top:0}
  169. .sf-shadow ul{padding:0 8px 9px 0;-moz-border-radius-bottomleft:17px;-moz-border-radius-topright:17px;-webkit-border-top-right-radius:17px;-webkit-border-bottom-left-radius:17px}
  170. .menus .sf-shadow ul.sf-shadow-off{background:transparent}
  171. .menu-primary-container{float:left;padding:0;position:relative;height:64px;background:none;z-index:400}
  172. .menu-primary{}
  173. .menu-primary ul{min-width:160px}
  174. .menu-primary li a{color:#979797;padding:26px 15px 25px 15px;text-decoration:none;text-transform:uppercase;font:normal 13px/13px 'Oswald',sans-serif}

Saludos.
Drewermerc.
  #6 (permalink)  
Antiguo 12/06/2014, 20:01
 
Fecha de Ingreso: junio-2014
Mensajes: 5
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: problema con fondo de sitio web.

Puedes poner una captura de la página?
  #7 (permalink)  
Antiguo 13/06/2014, 00:18
Avatar de seoista  
Fecha de Ingreso: septiembre-2003
Ubicación: Pues leyéndote
Mensajes: 1.076
Antigüedad: 21 años, 2 meses
Puntos: 59
Respuesta: problema con fondo de sitio web.

Tienes puesto: (=)

Código:
html{
height=100%;
width=100%;
margin =0;
padding =0;
}
En vez de: (:)

Código:
html{
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
Creo que ese debe ser el fallo.

Saludos.
  #8 (permalink)  
Antiguo 13/06/2014, 21:00
Avatar de Drewermerc  
Fecha de Ingreso: febrero-2014
Mensajes: 185
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: problema con fondo de sitio web.

Hola amigo gracias por responder pero no aun sigue en lo mismo ya no se que mas intentas nose si tengas alguna sugerencia al respecto e intentado varios métodos pero no se soluciona.
Saludos.
Drewermerc.
  #9 (permalink)  
Antiguo 13/06/2014, 22:53
Avatar de Drewermerc  
Fecha de Ingreso: febrero-2014
Mensajes: 185
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: problema con fondo de sitio web.

Hola todos.
gracias por sus respuestas pero ya lo puede resolver el problema no era css sino javascript ya que se hicieran mas grande los div's desde javascript entonces solo bastaba con hacerlos mas grandes para que ocuparan todo el espacio.

Saludos.
Drewermerc.

Etiquetas: Ninguno
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 05:17.