円のdivの一部を下から削除する

私はいくつかのCSSの形を使っています。私は円のdivを作りました。私は、円のdivの上半分の部分が見えるようにし、divの下に整列させる必要があるといういくつかの特定の設計要件を持っています。下半分（下半分）の半分を非表示にする必要があります。円のdivの一部を下から削除する

問題円形の下半分を削除したい問題です。次のdivに重複しています。

私はz-indexを試しましたが、ここでも私のコードは進歩しています。

.type1 { 
 
     position: absolute; 
 
     width: 600px; 
 
     height: 600px; 
 
     left: -100px; 
 
     top: 280px; 
 
     background: yellow; 
 
     bottom: 0; 
 
     border-radius: 50%; 
 
    } 
 
    .text{ 
 
      margin-left: 30%; 
 
     margin-top: 30%; 
 
    }

 <div style='background-image:url("https://i.imgsafe.org/69e56d5ec8.jpg");height: 600px;position:relative;'> 
 
     <div class="circleBase type1"> 
 
      
 
      <h1 class="text"> 
 
      some text inside 
 
      </h1> 
 
     </div> 
 
     </div> 
 
     <div> 
 
     <h1> 
 
     some other text 
 
     </h1> 
 
     </div>

JSFIDDLE

出典

2016-12-06 user3692459

コンテナdivに 'overflow：hidden'を試しましたか？ –

おいしい男！1は別の答えでこれを書くことができるので、私はそれをマークできますか？ – user3692459