CODEWITHSUNDEEP
cssless
Bomberis123
Bomberis123

Reputation: 378

Adjacent sibling selectors in less

Hi how to convert adjacent sibling selectors from css to less

Example:

#block .tall + p {
    [some attributes]
}

If I convert this to less like so

#block {
    .tall {
        + {
              p {
                }
          }
    }
}

I get ParseError: Unrecognised input in + {

When I try to use &+& { in conversion back to css it becomes

#block .tall + #block .tall p

Any help would be awesome. Thanks.

Upvotes: 2

Views: 1797

Answers (2)

Banzay
Banzay

Reputation: 9470

Here is a solution:

#block { 
    .tall + p {
        [some attributes] 
    }
}

Upvotes: 1

Pete
Pete

Reputation: 58462

You need to put the p on the same line as the +

Otherwise you are saying adjacent to nothing and the p is the child of that adjacent nothing:

#block {
  .tall {
    + p {}
  }
}

Example CodePen

Upvotes: 4

Related Questions