چگونه به المنت داخلی border بدهیم که بر روی border المنت بیرونی بیاید؟
https://lamtakam.com/qanda/763/چگونه-به-المنت-داخلی-border-بدهیم-که-بر-روی-border-المنت-بیرونی-بیاید؟ 1دوستان لطفا کد من رو ببینید: این از HTML:
<div class="compare_header_box">
<span class="compare_header_box_title active">List</span>
<div class="compare_header_box_items">
<a href="./gp">gp</a>
<a href="./in">in</a>
<a href="./tw">tw</a>
<a class="active" href="./fb">fb</a>
</div>
</div>
و این هم CSS:
.compare_header_box{
padding: 35px 30px;
direction: rtl;
}
.compare_header_box_title{
font-size: 30px;
width: 100px;
float: right;
margin-right: 5px;
margin-top: 4px;
}
.compare_header_box_items{
width: 100%;
border-bottom: 1px solid #ccc;
direction: ltr;
}
.compare_header_box_items a{
display: inline-block;
font-size: 16px;
padding: 15px 40px;
}
.compare_header_box_items a:hover{
text-decoration: none;
background-color: #f1f1f1;
color: black;
}
.compare_header_box_items .active{
border-top: 3px solid green;
border-right: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 1px solid white;
}
می خوام به المنت فعال border-bottom
بدم و رنگ سفید بهش بدم که خالی بشه و انگار از اونجا باز شده. چطور می تونم این کار را انجام بدم؟