Imagina que tenemos dos imágenes, la línea de arriba y la línea divisora. Digamos
topline.png y
middleline.png - Para mí el código sería algo así:
Código:
div.seccion {
background: transparent url("../images/topline.png") no-repeat center top;
padding: 15px;
}
div.seccion .moduletable {
background: transparent url("../images/middleline.png") no-repeat center bottom;
padding-bottom: 10px; /* digamos que cada imagen mide unos 7px de ancho y x de largo */
Entonces dado estos códigos quedaría el el index.php de la siguiente manera:
Código HTML:
<?php if($this->countModules('user3')) : ?>
<div class="seccion">
<jdoc:include type="modules" name="user3" style="xhtml" />
</div>
<?php endif; ?> Creo que el hecho que a tu código le agregues el
float: left te modifica el diseño. Intenta con esta simplicidad de código a ver que tal. Luego podrías modificar a tu gusto o agregar mas detalles.
NOTA: Este código sería aplicable asumiendo que ya tienes creado el div del wrapper principal, menú, etc. Solo te estoy dando los códigos que presuntamente se usarían para ese módulo o posición.