Tema: Distancia desde el top variable segun el contenido
Ver Mensaje Individual
  #6 (permalink)  
Antiguo 29/09/2011, 12:13
Avatar de IssuesGirl
IssuesGirl
 
Fecha de Ingreso: agosto-2010
Mensajes: 9
Antigüedad: 14 años, 3 meses
Puntos: 0
Respuesta: Distancia desde el top variable segun el contenido
Código CSS: 
Ver original
  1. /* Estilos Generales*/
  2.  
  3. body {
  4.     background-color: #791517;
  5.     background-image: url(../images/fondo.jpg);
  6.     background-repeat: repeat-x;
  7.     font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  8.     font-size:15px;
  9.     color:#666;
  10.     margin-top: 5px;
  11.     margin-bottom: 5px;
  12. }
  13. #contenedor {
  14.     position: relative;
  15.     width:1100px;
  16.     height:100%;
  17.     display: block;
  18.     clear: both;
  19.     margin:0 auto;
  20.     z-index: 1;
  21. }
  22. #barra_top {
  23.     background-color: #b1ab58;
  24.     height: 40px;
  25.     position:absolute;
  26.     top: 0px;
  27.     position:absolute;
  28.     width: 1100px;
  29.     border-bottom-left-radius: 0px;
  30.     border-bottom-right-radius: 0px;
  31.     border-top-left-radius: 10px; 
  32.     border-top-right-radius: 10px;
  33. }
  34. #top {
  35.     position: absolute;
  36.     top: 40px;
  37.     height: 283px;
  38.     width: 1100px;
  39.     align: center;
  40. }
  41.  
  42. #contenido {
  43.     position: absolute;
  44.     width: 865px;
  45.     top: 400px;
  46.     left: 10px;
  47. }
  48. #top_modulo {
  49.     height: 30px;
  50.     background-image:url(../images/top_modulo.png);
  51.     background-repeat: no-repeat;
  52. }
  53. /*#contenido_modulo {
  54.     position: absolute;
  55.     height: 400px;
  56.     width: 857px;
  57.     height: auto;
  58.     top: 30px;
  59.     left: 3px;
  60.     background-image:url(../imagenes/contenido_modulo.png);
  61.     background-repeat:repeat-y;
  62. }*/
  63. #abajo_modulo {
  64.     height: 30px;
  65.     background-image:url(../images/abajo_modulo.png);
  66.     background-repeat: no-repeat;
  67. }
  68. #modulo_1 {
  69.     z-index: 10;
  70. }
  71. #contenido_modulo_1 {
  72.     background-image:url(../images/contenido_modulo.png);
  73.     background-repeat:repeat-y;
  74. }
  75. #modulo_2 {
  76.     z-index: 10;
  77. }
  78. #contenido_modulo_2 {
  79.     background-image:url(../images/contenido_modulo.png);
  80.     background-repeat:repeat-y;
  81. }
  82. #medio_modulo_1 {
  83.  
  84.     width: 430px;
  85.     float: left;
  86. }
  87. #medio_modulo_2 {
  88.  
  89.     width: 430px;
  90.     float: right;
  91. }
  92.  
  93.  
  94. /* Estilos Barra Lateral del Home*/
  95.  
  96. #barra_lateral {
  97.     width: 200px;
  98.     position: absolute;
  99.     top: 323px;
  100.     right: 20px;
  101. }
  102. #top_barra_lateral {
  103.     background-image: url(../images/top_barra_lateral.png);
  104.     background-repeat: no-repeat;
  105.     height: 26px;
  106. }
  107.  
  108. #contenido_barra_lateral {
  109.     background-image: url(../images/contenido_barra_lateral.png);
  110.     background-repeat:repeat-y;
  111.     width: 200px;
  112.     text-align: justify;
  113. }
  114.  
  115. #abajo_barra_lateral {
  116.     background-image: url(../images/abajo_barra_lateral.png);
  117.     background-repeat: no-repeat;
  118.     height: 26px;
  119.  
  120.     /*top: 198px;*/
  121. }
  122.  
  123. #barra_pie {
  124.     top: auto;
  125.     height: 40px;
  126.     width: 1100px;
  127.     background-color: #b1ab58;
  128.     border-radius: 10px;
  129. }
  130.  
  131. .titulo {
  132.     font-size: 20px;
  133.     font-weight: bold;
  134.     color: #611313;
  135.     text-decoration: underline;
  136.     text-align: justify;
  137.     text-indent: 30px;
  138. }
  139. .titulo2 {
  140.     font-size: 16px;
  141.     font-weight: bold;
  142.     color: #611313;
  143.     text-decoration: underline;
  144.     text-align: justify;
  145.     text-indent: 10px;
  146. }
  147. .texto {
  148.     text-indent: 30px;
  149.     font-size: 15px;
  150.     text-align:justify;
  151. }
  152. .texto2 {
  153.     text-indent: 20px;
  154.     font-size: 15px;
  155.     color:#511E1A;
  156.     font-weight:bold;
  157. }
  158. .texto3 {
  159.     text-indent: 20px;
  160.     font-size: 15px;
  161.     color:#791517;
  162. }
  163. .boton {
  164.     font-size: 15px;
  165.     font-weight: bold;
  166.     color: #611313;
  167.     text-align: center;
  168. }
  169. a {
  170.     font-size: 15px;
  171.     color: #611313;
  172.     font-weight: bold;
  173.     text-decoration: underline;
  174. }
  175. a:visited {
  176.     color: #333;
  177. }
  178. a:hover {
  179.     color: #333;
  180.     text-decoration: underline;
  181. }
  182. a:active {
  183.     color: #611313;
  184. }
  185. .inputbox {
  186.     background-color: #511E1A;
  187.     padding-left: 10px;
  188.     border-top-style: none;
  189.     border-right-style: none;
  190.     border-bottom-style: none;
  191.     border-left-style: none;
  192.     margin-top: 2px;
  193.     margin-bottom: 2px;
  194.     border-radius: 10px;
  195.     -webkit-border-radius: 10px;
  196.     color:#FFF;
  197. }
  198.  
  199. h2 {
  200.     color: #611313;
  201. }
  202.  
  203. h2 {
  204.     border-bottom-color: #511E1A;
  205.     display: block;
  206.     border-bottom-width: 1px;
  207.     border-bottom-style: solid;
  208. }
  209. h3 {
  210.     border-bottom-color: #511E1A;
  211.     display: block;
  212.     border-bottom-width: 1px;
  213.     border-bottom-style: solid;
  214. }
  215.  
  216. .moduletable_menu {
  217.     width: 162px;
  218. }
  219.  
  220. /* VirtueMart*/
  221.  
  222. #med_ele{
  223.     width: 810px;
  224. }
  225.  
  226. #vmMainPage{
  227.     width: 810px;
  228. }
  229.  
  230. #med_ele .shop_info{
  231.     width: 810px;
  232. }
  233.  
  234. #contenido_barra_lateral .moduletable {
  235.     width: 162px;
  236. }