Html 内有文本的CSS形状

我需要帮助。到目前为止，我能够创建左div，但我仍然使用第二个div，从右开始的一个。有小费吗

---

@mihal如果你也分享一些HTML和css，我们会很有帮助，只要看看图片，就很难识别和修复它。说明你到底想做什么以及到目前为止你做了什么。@mihal不确定你是否共享了正确的图像css形状，它在背景中有图像，而你的css没有引用。我从psd中剪切了那张图片…背景颜色不重要。我只需要对齐这两段文字

This is the HTML

<div class="shape">
  ALEGETI MEDIEREA
    </div>

      .shape{
  text-align:center;
  background-color:#8ed7c2;
  width:50%;
  height:178px;
  line-height:178px;
  color:#fef5ca;
  float:left;
  position:relative;
  font-size:50px;
  top:20px;


}
.shape:after{
  content:"";
  width:0px;
  height:178px;
  border-top:178px solid rgba(3,78,136,0.7);
  border-right:60px solid transparent;
  position:absolute;
   left:100%;


}

This is the HTML

<div class="shape">
  ALEGETI MEDIEREA
    </div>

      .shape{
  text-align:center;
  background-color:#8ed7c2;
  width:50%;
  height:178px;
  line-height:178px;
  color:#fef5ca;
  float:left;
  position:relative;
  font-size:50px;
  top:20px;


}
.shape:after{
  content:"";
  width:0px;
  height:178px;
  border-top:178px solid rgba(3,78,136,0.7);
  border-right:60px solid transparent;
  position:absolute;
   left:100%;


}