Foros del Web » Creando para Internet » CSS »

Problema con esquinas redondeadas (con imágenes)

Estas en el tema de Problema con esquinas redondeadas (con imágenes) en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 21/11/2006, 15:52
Avatar de hector_he  
Fecha de Ingreso: agosto-2006
Ubicación: Barcelona
Mensajes: 207
Antigüedad: 11 años, 4 meses
Puntos: 4
Problema con esquinas redondeadas (con imágenes)

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 ametconsectetuer 
          … 
       
</div
    </
div
</
div
Código PHP:
.caja {     width482px
    
background-imageurl("centro.gif"); 
    
background-repeatrepeat-y


.
cajaarriba 
    
background-imageurl("arriba.gif"); 
    
background-positiontop center
    
background-repeatno-repeat


.
cajaabajo 
    
background-imageurl("abajo.gif"); 
    
background-positionbottom left
    
background-repeatno-repeat
    
padding15px 15px 15px 15px



Código aplicado
Código PHP:
.text{
    
width:510px
    
margin12px 0px 20px 185px
    
background#FF6699 url(images/bgtext.gif) repeat-y;
}
.
texttop 
    
background-imageurl(images/texttop.gif);
    
background-positiontop center
    
background-repeatno-repeat;

.
textbottom 
    
background-imageurl(images/textbottom.gif); 
    
background-positionbottom left
    
background-repeatno-repeat
    
padding15px 15px 15px 15px

Código PHP:
<div class="text"
<
div class="texttop"
<
div class="textbottom"
"TEXTO"
</div>
   </
div
    </
div
  #2 (permalink)  
Antiguo 23/11/2006, 17:09
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Porque está hecho para eso

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.
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 20:47.