Cant target element using css first-child/nth-child?

Question

Please refer to this page: http://www.newsweekgradplus.com/Business/Degree/Accounting

if you look at the middle column, the first 4 boxes are grey and after that in white.

What I want to do is add a horizontal line btween the grey and the white rectangle but i cant seem to target it.

Answer 1

This will make any white box preceded by br and a gray box will have a (black) border on top of it.

.mbaBox+br+.mbaBox-white {
    position: relative;
}

.mbaBox+br+.mbaBox-white:after {
    content: " ";
    background: #000; /* your color */
    width: 100%;
    height: 1px;
    position: absolute;
    top: -10px;
    left: 0;
}

Answer 2

With selector .mbaBox+br+.mbaBox-white you will get the first white box after gray box, custom your css for this element :).

Have fun !

Read more here http://www.w3schools.com/cssref/sel_element_pluss.asp