Problema/Ayuda con border-radius en div CSS3

[sextasilon]

Hola a todos, estoy tratando de lograr un efecto parecido al de la imagen:



Si se fijan, no se hace agregandole solamente border-radius a las esquinas superiores, y es por eso que no llego a lograr el efecto, si alguien tiene idea de como hacerlo, se lo agradeceria mucho :D

[kseso?]

Su imagen no se ve.

Sería conveniente que acompañe su consulta con los códigos implicados (html+css)

[sextasilon]

Iniciado por kseso?

Su imagen no se ve.

Sería conveniente que acompañe su consulta con los códigos implicados (html+css)

Ahi la subi de vuelta. Y respecto al codigo, no lo tengo, sino no preguntaria xD.
Aca esta la imagen

[kseso?]

Iniciado por sextasilon

Ahi la subi de vuelta. Y respecto al codigo, no lo tengo, sino no preguntaria xD.

Quién lo diría, a tenor de lo que dijo

Iniciado por sextasilon

Hola a todos, estoy tratando de lograr un efecto parecido al de la imagen:

también con un xD

Dejando a un lado el fondo, es únicamente la propiedad border-radius:
http://www.css3.info/preview/rounded-border/
declarando el valor apropiado o también utilizando la propiedad extendida (no shorthand):
border-bottom-left-radius, border-bottom-right-radius, border-top-left-radius, border-top-right-radius

[sextasilon]

Iniciado por kseso?

Quién lo diría, a tenor de lo que dijo

también con un xD

Dejando a un lado el fondo, es únicamente la propiedad border-radius:
[url]http://www.css3.info/preview/rounded-border/[/url]
declarando el valor apropiado.

No entendi lo primero que dijiste, espero que no hayan mal interpretado mi respuesta y haya sonado grosero, si fue asi, pido disculpas .
Gracias por la respuesta, ahora voy a ver si me sale :)
Y pido perdon de vuelta, si es que se mal interpreto

[kseso?]

No se haga quebrantos, yo también utilicé el xD.

Juegue con esas propiedades y si no lo consigue, vuelva a consultar por aquí con los códigos que tenga y el atasco en el que se encuentre.

Más info: las especificaciones de la w3c con más ejemplos (código e imágenes del resultado).

[inghard]

yo creo que el problema de este usuario es que al cargar la imagen como <img /> ésta sigue con los bordes cuadrados, en mi caso, lo que hago yo es dejar un <div> sin contenido y en el css asigno las propiedades que tendrá la imagen, dejandola como un background-image.

ej:

html

Código:

<div id="imagen"> 
<!--El contenido sólo será visto por el css-->
</div>

css

Código:

#imagen{
width:400px;
height:300px;
border-radius: 20px 20px 0 0;
background-image:url(..img/imagen.jpg);
}

espero que te sea de ayuda
saludos

[C2am]

Bienvenido inghard
Me alegro que tomara el puesto vacante de adivino del foro, hace rato que el último fue desterrado de estas tierras.

La cuestión, y sin animo de criticar su trabajo adivinezco, debo mencionar que sextasilon no hace referencia a estar trabajando con una imagen, sino que muestra una imagen donde se ve el efecto que quiere lograr, y si consideramos el título es claro que pretende hacerlo mediante css3.

Aparte de eso no da mayores precisiones, y es por ello que se le reclama por códigos y/o enlaces para ver donde, efectivamente, se trabó.

Pero no se desanime, la verdad que va a tener mucho trabajo en forosdelweb, ya que son muchos los que consultan jugando a las adivinanzas

Saludos