if you checkout this fiddle: http://jsfiddle.net/hr9SN/ - you can see that the long horizontal line is very thin compared to the other lines. It's not come like that from illustrator, as shown in the image below it. I've got the code from Illustrators SVG Code dialog. I've played with the stroke width too but it doesn't help, it exaggerates the problem if anything.
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 456 251" enable-background="new 0 0 456 251" xml:space="preserve">
<polyline class="svg" points="7.7,221.4 10.7,221.4 10.7,210.4 0.7,210.4 0.7,221.4 5.7,221.4 5.7,252.4 456.7,252.4 456.7,0.4 "/>
</svg>
<img src="http://cl.ly/image/341r2T34103X/Screen%20Shot%202014-07-22%20at%2014.34.27.png" alt="">
Do you know how I could fix this and/or what the problem is?
Cheers.
You're drawing lines right along the edge of your viewport. As a result, parts of these lines are being drawn outside the viewable area.
Make your viewbox bigger. This should do the trick:
viewBox="0 0 460 255"