Tema: html personalizado con imagen mueve los modulo superiores
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/11/2011, 16:19
alx_salazar
 
Fecha de Ingreso: septiembre-2008
Mensajes: 192
Antigüedad: 15 años, 7 meses
Puntos: 1
html personalizado con imagen mueve los modulo superiores
hola comunidad,

estoy muy confuso , se que al crear un modulo HTML personalizado para insertar un imagen y ponerlo en una poscion posterior, y no entiendo por que lo desplaza a la capa de superior, existe alguna posibilidad de poner este HTML personalizado, sin que mueva la capa superior, ya que esta solo aparecerá en el home.
Ya que si le inserto la imagen en un articulo me pone margenes, lo que deseo es que no me de bordes y no quiero cambiar los estilos ya que me dañaria todo... me pueden dar alguna sugerencias??? este es el código de capa que uso.

quiero insertar una imagen sin margenes que solo este la imagen como se lo hace en un HTML personalizado.

HE LOGRADO MUCHOS AVANCES SOY NUEVO EN ESTA HERRAMIENTA Y NO CONSIGO REALIZAR LO QUE DESEO.

esta plantilla lo gre crearla para adaptarla al joomla 1.5

Llevo varios dias no se que hacer mas por eso estoy aca acudiendo a una comunidad con mayor conocimiento, ya que el ser humano nunk deja de aprender.


Código HTML: 
Ver original
  1. <body>
  2.  
  3.     <div id="body">
  4.         
  5.         <div id="headerSidebar">
  6.             <jdoc:include type="modules" name="headerSidebar"  style="xhtml" />
  7.         </div>
  8.      
  9.         <div id="head_contenedor">
  10.             <div id="header">
  11.                 <jdoc:include type="modules" name="head_contenedor" style="xhtml" />
  12.             </div>   
  13.                   
  14.             <div id="headerSearch">
  15.                  <jdoc:include type="modules" name="headerSearch" style="xhtml" />
  16.             </div>
  17.         </div>
  18.            
  19.         <div id ="menu"> <jdoc:include type="modules" name="menu" /> </div>             
  20.              
  21.             <div id = "contenedor">                         
  22.                     <jdoc:include type="modules" name="contenedor"  style="xhtml" />
  23.         
  24.           
  25.                      <div id="sidebar">                 
  26.                          <jdoc:include type="modules" name="sidebar"  style="xhtml" /> 
  27.                     </div> 
  28.                       
  29.                     <div id = "contenedor"> 
  30.                         <jdoc:include type="component" /> 
  31.                     </div>
  32.                           
  33.                         <div id ="contentop">
  34.                                 <jdoc:include type="modules" name="contentop"  style="xhtml" />
  35.                         </div>
  36.                      
  37.                      <div id="contenttop_sidebar">                  
  38.                     <jdoc:include type="modules" name="contenttop"  style="xhtml" /> 
  39.               </div>
  40.  
  41.             </div>
  42.  
  43.             <div id="footer">odos los derechos reservados
  44.                  <jdoc:include type="modules" name="footer"  style="xhtml" />
  45.             </div>
  46.     
  47.     </div>
  48.  
  49.  
  50. </body>

estilos

Código CSS: 
Ver original
  1. #body {
  2.     width:1259px;       
  3.     margin: 10px auto;  
  4.     border: 2px solid #6d6f71;
  5.     
  6. }
  7. #head_contenedor{
  8.     width:998px;
  9.     height:266px;
  10.     }
  11.  
  12. #header {
  13.     width:832px;
  14.     height:264px;
  15.     float:left;
  16.     background-image:url(../images/header.jpg);
  17.     background-repeat: no-repeat;
  18.     
  19. }
  20.  
  21. #headerSearch{  
  22.     width:164px;
  23.     float:right;
  24.     height:265px;
  25.     position: static;
  26.     text-align:center;  
  27. }
  28.  
  29. #headerSidebar{
  30.     height: 300px;
  31.     width: 261px;   
  32.     float:right;
  33.     background-image: url(../images/sidebar.jpg);
  34.  
  35.     background-repeat: no-repeat;
  36.     }
  37.  
  38. #menu{
  39.     max-width:998PX;
  40.     min-width:998px;
  41.     height:34px;
  42.     background-color: #6d6f71;
  43.     text-align:center;
  44.     margin-top: auto;
  45.     
  46.     }
  47.  
  48. #contenedor{
  49.     width:1259px;
  50.     min-height:550px;
  51.     overflow:auto;
  52.     float:right;
  53.     overflow-x: hidden;
  54.     background-repeat: no-repeat;   
  55.     }
  56.  
  57. #contenedor{
  58.     width:980px;
  59.     min-height:410px;
  60.     float:left;
  61.     overflow-y: hidden;
  62.     padding-top:1.5em;
  63.     margin-left: 0.5em;
  64.     margin-right:0.5em;
  65. }
  66.  
  67. #contentop{
  68.     width:998px;
  69.     height:125px;
  70.     float:left;
  71.     background-image: url(../images/contenttop.jpg);
  72.     background-repeat: no-repeat;
  73.     
  74. }
  75.  
  76. #sidebar{
  77.     width:260px;
  78.     min-height:435px;
  79.     float:right;
  80.     margin-left:auto;
  81.     margin-right:auto;
  82. }
  83. #contenttop_sidebar{
  84.     width:260px;
  85.     min-height:125px;
  86.     float: right;
  87.     margin-left:auto;
  88.     margin-right:auto;
  89. }
  90.  
  91. #footer{
  92.     width:1259px;
  93.     height:18px;
  94.     background-repeat: no-repeat;
  95.     background-color: #6d6f71;
  96.     text-align:center;
  97.     clear:both;
  98. }