Столкнулась с проблемой мне нужно убрать последнию линию справа и нужно убрать линию сверху, оставить только по середине, но при попытке это сделать через first-child, last-child, nth-last-child(odd), nth-last-child(even), оно применяется ко всем моим категориям. Почему? Помогите исправить, заранее всем спасибо. Это код:
<!--categories-->
<div class="categories">
<div class="buttonsRow rounded row">
@foreach($categories as $category)
<div class="col-lg-2 myDiv" >
<div style="clear: both;"></div>
<a class="c category-link btn btn-danger btn-lg loading buttonload" data-loading-text="<i class='fa fa-circle-o-notch fa-spin'></i>" id="load" href="{{ route('home').'?category='.$category->url }}">{{ $category->name}}</a>
</div>
@endforeach
</div>
</div>
<!--//categories-->
.categories {
width: 100%;
margin: 0;
text-align: center;
//font-family: $primary-font;
font-weight: normal;
font-size: 14px;
padding: 20px 0;
@media (max-width:1270px){
column-count: 2;
}
}
.row.buttonsRow {
margin-left: -4px;
margin-right: -4px;
> * {
padding: 3px 5px;
border-top: 1px groove;
}
}
.c {
//width: 19.9%;
outline: none;
padding: 16px 15px;
//border-left: 1px solid $black-color;
border-right: 1px solid $black-color;
//border-radius: 9px;
height: 56px;
margin: 1px 2px 3px 4px;
display: block;
text-decoration: none;
color: $black-color !important;
font-weight: normal;
font-size: 14px;
font-family: $black-color;
//transition: all ease 0.5s;
@media (max-width:2800px) {
max-height: 100%;
max-width: 100%;
}
}
.c :nth-last-child(even) {
border-left: none;
}
.c:nth-last-child(2) {
border-left: none;
}
.c {
&:hover {
background: #E2E1E1;
color: $black-color !important;
}
}
.active{
background: #e6007e;
color: #ffffff !important;
font-weight:bold;
}
/* --//categories--*/
.myDiv:last-child .c {border-left: none;}