Foros del Web » Creando para Internet » CSS »

No agranda fondo

Estas en el tema de No agranda fondo en el foro de CSS en Foros del Web. hola que tal pues aqui batallando con unos estilos que no me deja agarandar la imagen de fondo o no se que pasa miren el ...
  #1 (permalink)  
Antiguo 08/06/2011, 21:55
 
Fecha de Ingreso: marzo-2011
Ubicación: Victoria,Mexico
Mensajes: 45
Antigüedad: 6 años
Puntos: 0
No agranda fondo

hola que tal pues aqui batallando con unos estilos que no me deja agarandar la imagen de fondo o no se que pasa miren el codigo es el siguiente.

Código CSS:
Ver original
  1. * { padding: 0; margin: 0; outline: 0; }
  2.  
  3. body, html { height: 100%; }
  4.  
  5. body {
  6.     background: #e1e5e8;
  7.     font-family: "Georgia", Tahoma, Sans-Serif;
  8.     font-size: 14px;
  9.     line-height: 18px;
  10.     color: #333;
  11. }
  12. input, textarea, select { font-family: "Georgia", Tahoma, Sans-Serif; font-size:12px; }
  13. .field { padding: 4px 5px; border: solid 1px #e7e7e7; color: #969696; height: 15px; }
  14. .field-focused { color: #333; }
  15. input.button { padding: 4px 5px; cursor: pointer; }
  16.  
  17. a {
  18.     color: #45c7ee;
  19.     text-decoration: underline;
  20.     /* [disabled]cursor: pointer; */
  21. }
  22. a:hover { text-decoration: none; }
  23. a img { border: 0; }
  24.  
  25. h2 { font-size: 19px; line-height: 1; font-weight: normal; color: #464646; font-family: "Trebuchet MS", Tahoma, Sans-Serif; margin-bottom: 5px; }
  26.  
  27. p { padding-bottom: 18px; }
  28.  
  29. .left, .alignleft { float: left; display: inline; }
  30. .right, .alignright { float: right; display: inline; }
  31.  
  32. .cl { font-size: 0; line-height: 0; clear: both; display: block; height: 0; }
  33.  
  34. .notext { font-size: 0; line-height: 0; text-indent: -4000px; background-repeat: no-repeat; }
  35.  
  36. .al { text-align: left; }
  37. .ar { text-align: right; }
  38. .ac { text-align: center; }
  39.  
  40. #page { width: 874px; margin: 0 auto; }
  41. #page { padding: 0 28px; min-height: 100%; height: auto !important; height: 100%; background: url(images/bg.gif) repeat-y center 0; }
  42.  
  43. #top { padding: 20px 0 16px; }
  44.  
  45. #logo { float: left; display: inline; width: 233px; font-size: 0; line-height: 0; }
  46. #logo a { display: block; height: 67px; text-indent: -4000px; background: url(images/logo.gif); }
  47.  
  48. #search { float: right; display: inline; padding-top: 18px; width: 227px; }
  49. #search .field-holder { float: left; display: inline; width: 196px; background: url(images/search-field.gif) no-repeat 0 0; padding: 1px; }
  50. #search .field { width: 186px; border: 0; background: none; }
  51. #search .button { float: right; display: inline; width: 25px; height: 25px; font-size: 0; line-height: 0; text-indent: -4000px; }
  52. #search .button { background: url(images/search-button.gif) no-repeat 0 0; border: 0; }
  53.  
  54. #navigation { height: 38px; background: url(images/navigation.gif) no-repeat; padding: 8px 10px 6px; margin-top: 16px; }
  55. #navigation ul { font-size: 13px; line-height: 38px; text-transform: capitalize; }
  56. #navigation ul li { float: left; display: inline; list-style-type: none; padding-right: 2px; }
  57. #navigation ul li a { float: left; display: inline; color: #fff; text-decoration: none; padding-left: 17px; }
  58. #navigation ul li a span { float: left; display: inline; padding-right: 17px; background-position: right 0 !important; }
  59. #navigation ul li a:hover,
  60. #navigation ul li a.active,
  61. #navigation ul li a:hover span,
  62. #navigation ul li a.active span { color: #717171; background: url(images/nav-active.gif) no-repeat 0 0; }
  63.  
  64. #header { padding-bottom: 10px; }
  65.  
  66. #slider { height: 327px; background: url(images/slider.gif) no-repeat 0 0; position: relative; }
  67. #slider .slider-nav a { display: block; width: 18px; height: 49px; font-size: 0; line-height: 0; text-indent: -4000px; position: absolute; top: 120px; }
  68. #slider .slider-nav a.prev { left: 0; background: url(images/button-prev.gif); }
  69. #slider .slider-nav a.next { right: 0; background: url(images/button-next.gif); }
  70.  
  71. #slider-holder { height: 327px; }
  72. #slider-holder .jcarousel-clip { height: 327px; width: 874px; position: relative; overflow: hidden; }
  73. #slider-holder .slide-image { float: right; display: inline; }
  74. #slider-holder .slide-info { float: left; display: inline; width: 424px; padding-top: 23px; }
  75. #slider-holder .slide-info p { padding-bottom: 8px; }
  76. #slider-holder ul { width: 874px; height: 327px; position: relative; overflow: hidden; }
  77. #slider-holder ul li { list-style-type: none; float: left; display: inline; height: 267px; width: 712px; padding: 56px 108px 4px 54px; position: relative; overflow: hidden; }
  78.  
  79. #main { border-bottom: solid 1px #e3e7e9; margin-bottom: 6px; }
  80.  
  81. h2.txt-we-love-mondays { height: 94px; background-image: url(images/txt-we-love-mondays.gif); }
  82. h3.txt-monday-again { background-image: url(images/txt-monday-again.gif); }
  83. h3.txt-wedothis { background-image: url(images/txt-wedothis.gif); }
  84. h3.txt-247 { background-image: url(images/txt-247.gif); }
  85.  
  86. .button-more { display: block; width: 66px; height: 22px; font-size: 0; line-height: 0; text-indent: -4000px; background: url(images/button-more.gif) no-repeat 0 0; }
  87. .more { padding-left: 10px; background: url(images/arr.gif) no-repeat 0 center; }
  88.  
  89. .cols { padding: 15px 0 10px; }
  90. .cols .col { float: left; display: inline; }
  91. .cols .col-last { margin-right: 0 !important; }
  92. .cols .col h3.notext { height: 45px; margin-bottom: 5px; }
  93.  
  94. .three-cols .col { width: 264px; margin-right: 41px; }
  95. .two-cols .col { width: 420px; margin-right: 34px; }
  96.  
  97. #footer { height: 41px; background: url(images/footer.gif) no-repeat 0 0; line-height: 41px; padding: 10px 10px 10px 22px; color: #fff; }
  98. #footer p { padding-bottom: 0; }
  99. #footer a { color: #fff; text-decoration: none; }
  100. #footer a:hover { color: #237087; }
  101. #footer span { margin: 0 6px; }

no se mucho de css pero creo que donde esta todo el show es en estas lineas de codigo o bueno eso creo

Código CSS:
Ver original
  1. #page { width: 874px; margin: 0 auto; }
  2. #page { padding: 0 28px; min-height: 100%; height: auto !important; height: 100%; background: url(images/bg.gif) repeat-y center 0; }

la imagen es una imagen de 32.81 cm de largo x 0.04 cm de ancho que es una minitira que se repite acia abajo dasndo el efecto de un cuadro con sombras y todo el problema es que aunque modifiqu el tamaño de la imagen el tamaño de fondo sigue estando exactamente igual espero que me pudieran ayudar
  #2 (permalink)  
Antiguo 08/06/2011, 22:07
Avatar de rebocano  
Fecha de Ingreso: enero-2007
Ubicación: Me encuentro ubicado en C
Mensajes: 37
Antigüedad: 10 años, 2 meses
Puntos: 2
Respuesta: No agranda fondo

prueba agregando esto:
#page {
width: 874px;
margin: 0 auto;
padding: 0 28px;
min-height: 100%;
height: auto !important;
height: 100%;
background: url(images/bg.gif);
background-repeat: repeat-x ;
}

No logré entender muy bien pero veamos si esto te sirve.
  #3 (permalink)  
Antiguo 08/06/2011, 22:24
 
Fecha de Ingreso: marzo-2011
Ubicación: Victoria,Mexico
Mensajes: 45
Antigüedad: 6 años
Puntos: 0
Respuesta: No agranda fondo

Cita:
Iniciado por rebocano Ver Mensaje
prueba agregando esto:
#page {
width: 874px;
margin: 0 auto;
padding: 0 28px;
min-height: 100%;
height: auto !important;
height: 100%;
background: url(images/bg.gif);
background-repeat: repeat-x ;
}

No logré entender muy bien pero veamos si esto te sirve.
a ke no le entendiste bien rebocano eso que me pasaste lo hice pero no funciono se desapararecio el fondo te pasare lo que quiero agrandar es el fondo blanco

https://lh3.googleusercontent.com/-MrlycnBWbvc/TfBKndxxMHI/AAAAAAAAA1Q/ifl8DzjXH5s/s800/Captura.PNG

espero me puedas ayudar brother

Última edición por davidmrtnz413; 08/06/2011 a las 22:25 Razón: texto equivocado
  #4 (permalink)  
Antiguo 08/06/2011, 23:24
 
Fecha de Ingreso: marzo-2011
Ubicación: Victoria,Mexico
Mensajes: 45
Antigüedad: 6 años
Puntos: 0
Respuesta: No agranda fondo

ya encontre como hacerle baaa todo lol que estab solamente era incrementarl el valor en el padding

Código CSS:
Ver original
  1. #page { padding:128px; min-height: 100%; height: auto !important;

Etiquetas: agrandar, estilocss, 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 18:25.