title: CSS: Hover over one element, effect another?
body: <p>Please see the page here:</p>
  
  <pre><code>http://176.32.230.17/printingcrazy.com/branding-services
  </code></pre>
  
  <p>I'm trying to achieve a hover effect, so if you hover over any of the services listed, the relevant image will have a border for example.   </p>
  
  <p>And if you hover over the Image, the relevant text will change color.</p>
  
  <p>Elements on the left are in a separate parent to the ones on the right.</p>
  
  <p>Yes I have seen <a href="https://stackoverflow.com/questions/1462360/css-hover-one-element-effect-for-multiple-elements">CSS: Hover one element, effect for multiple elements?</a>  and have tried everything, but cannot get it to apply to my circumstances.</p>
  
  <p>Any help would really be appreciated!</p>
  
  <pre><code>&lt;div class="servicepage"&gt;
  
  &lt;div class="serviceleft"&gt;
  &lt;img src="/digitalprint.jpg"&gt;
  &lt;img src="/dyesub.jpg"&gt;
  &lt;/div&gt;
  
  &lt;div class="serviceright"&gt;
  &lt;ul&gt;
  &lt;li&gt;
  &lt;h3&gt;Digital Print&lt;/h3&gt;
  &lt;/li&gt;
  &lt;li&gt;
  &lt;h3&gt;Dye Sublimation&lt;/h3&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>