title: Kendo UI DropDownList - skinning issues with CSS
body: <p>I am attempting to skin a <code>Kendo UI DropDownList</code> widget for my own site, and have had fairly good success with a small caveat that is driving me nuts.</p>
  <p>I am including a link to a jsBin that demonstrates the issue, and some screenshots. But basically what is happening is that I want the entire dropdown list to be flat (no border radius), and then to be very solid (white background, black text) and the currently selected item to have a thick red bar as its left border (3px in my example), and then as you hover over the items in the list box, their left border becomes a thick greenish/blue bar.</p>
  <p>This is working, except for some strange spacing issues; First of all, as I hover over things, they &quot;jump&quot; around. They get pushed this way and that a bit obnoxiously, making it feel non-uniform. I really want to fix that; and the thing that is driving me the most nuts is that the &quot;bar&quot; that I use on the left-border is having a strange curvature to it, making it look very out of place, as if it is almost beveled. Can anyone assist with this?</p>
  <h1><a href="http://jsbin.com/UsEXePur/1/edit" rel="nofollow noreferrer">jsBin Example</a></h1>
  <p><img src="https://i.stack.imgur.com/l1yp3.jpg" alt="enter image description here" /></p>