Problema con esquinas redondeadas (con imágenes)

[hector_he]

Hola,
Consulté en Desarrollo web como hacer esquinas redondeadas, siguiendo el mismo patrón y aplicando a la págaina que diseño me encuentro que las imágenes con los bordes redondeados quedan dentro de la caja donde está el texto..
Alguien sabe el porqué?
Gracias de antemano.

Código del Tutorial

Código PHP:

  <div class="caja"> 
    <div class="cajaarriba"> 
       <div class="cajaabajo"> 
          Lorem ipsum dolor sit amet, consectetuer 
          … 
       </div> 
    </div> 
</div> 
   

Código PHP:

  .caja {     width: 482px; 
    background-image: url("centro.gif"); 
    background-repeat: repeat-y; 
} 
 
.cajaarriba { 
    background-image: url("arriba.gif"); 
    background-position: top center; 
    background-repeat: no-repeat; 
} 
 
.cajaabajo { 
    background-image: url("abajo.gif"); 
    background-position: bottom left; 
    background-repeat: no-repeat; 
    padding: 15px 15px 15px 15px; 
} 
   

Código aplicado

Código PHP:

  .text{
    width:510px; 
    margin: 12px 0px 20px 185px; 
    background: #FF6699 url(images/bgtext.gif) repeat-y;
}
.texttop { 
    background-image: url(images/texttop.gif);
    background-position: top center; 
    background-repeat: no-repeat;
} 
.textbottom { 
    background-image: url(images/textbottom.gif); 
    background-position: bottom left; 
    background-repeat: no-repeat; 
    padding: 15px 15px 15px 15px; 
} 
   

Código PHP:

  <div class="text"> 
<div class="texttop"> 
<div class="textbottom"> 
"TEXTO"
</div>
   </div> 
    </div> 
   

[Mikmoro]

Porque está hecho para eso. No sé cómo serán exactamente tus gifs, pero la idea es que, para que funda el borde con el fondo del centro sin que se note nada es que esté en el mismo div. De hecho, fíjate que metes el texto en el div con la imagen del borde inferior, que alineas abajo a la izquierda y dices que no se repita. En realidad tu estás escribiendo en la capa que tiene ese fondo, y por eso tu texto monta sobre el fondo, como te digo intencionadmente.

Si no quieres que monte, simplemente aumenta el padding y de esa forma alejas el texto del gráfico lo que tú quieras, por ejemplo así:

padding: 25px 15px 25px 15px;

Mikel.