0

My issue is as follows: I've got a navigation bar with main navigation and some of these links have additional drop down menus. I'm trying to change the styling of the main link, whenever I hover over the drop down menu. I can't use classes as it will change the style of all the main nav links. Which means I can't use the following method

.dropdown:hover ~ .main{
    change css here
}

I also can't use individual IDs for the linked drop down and main nav as it appears on too many pages already.

The format of the HTML is as follows

<a class="main-link">Main Link</a>
<div class="drop-down"></div>

My question is; is there a way to change the style of an element which appears directly before an element within a HTML document?

Toby Cannon
  • 725
  • 6
  • 16
  • What effect you want to achieve? Provide SO Snippet with menu structure and css – Justinas Aug 05 '15 at 10:47
  • If you're still struggling, I would suggest [this answer](http://stackoverflow.com/a/27993987/2117156). Here's an [example](http://jsfiddle.net/axLkp74k/) too – Jamie Barker Aug 05 '15 at 11:23

0 Answers0