My border-radius not working in all four corners-CodePudding

I'm trying do my border-radius works in all four corners but ir dosent happen. Someone can help me?

my HTML:

#generic_table .generic_content .generic_head .generic_head_content .head_bg {
  border-color: #8cc63f;
  border-radius: 25px;
}

#generic_table .generic_content .generic_head .generic_head_content .head span {
  color: #fff;
}

#generic_table .generic_content {
  overflow: hidden;
  position: relative;
  text-align: center;
  border-radius: 25px;
}

#generic_table .generic_content .generic_head .generic_head_content {
  margin: 0 0 30px 0;
}

#generic_table .generic_content .generic_head .generic_head_content .head_bg {
  border-style: solid;
  border-width: 45px 1300px 20px 399px;
  position: absolute;
}

#generic_table .generic_content .generic_head .generic_head_content .head {
  padding-top: 15px;
  position: relative;
}

#generic_table .generic_content .generic_head .generic_head_content .head span {
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 1px;
  margin: 0;
  padding: 0;
}

<div id="generic_table">
  <div >
    <div >
      <div >
        <div ></div>
        <div >
          <span>AÇÕES</span>
        </div>
      </div>
    </div>
  </div>
</div>

I have no idea what might be going on.

PS: I'm doing some testing and I believe my problem is with 'head_bg'.

CodePudding user response：

The padding here is causing an issue (div ). If padding-top is 0 the corners are rounded better. As the padding increases, that 1 corner gets squared-off more.

#generic_table .generic_content .generic_head .generic_head_content .head {
    padding-top: 15px;
    position: relative;
}