1

Bom dia, gostaria de saber se é possivel e como fazer para criar uma div com essa curva em U para cima e para baixo usando apenas css, tentei de várias maneiras e não consegui.

Obrigado.

inserir a descrição da imagem aqui

1 Resposta 1

4

Recomendo sempre que fizer uma pergunta aqui, por algum código, ou exemplo visual com código no http://jsfiddle.net/ por exemplo. É interessante mostrar algum esforço.

Minha solução é essa DEMO:

Html:

<div class="wrapper">
<div class="curve curve-top">
</div>
<div class="curve curve-bottom">
</div>
</div>

Css:

  div.wrapper {
      background-color:black;
       width:500px;
  }

  div.curve {
    background-color:white;
    width:500px;
    height:150px;
  }

  div.curve-top{   
      border-bottom-left-radius:70%;
      border-bottom-right-radius:70%;
  }

  div.curve-bottom {  
      margin-top: 50px;
      border-top-left-radius:70%;
      border-top-right-radius:70%;
  }

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .