I am trying to make a responsive page with an SVG and some text. Basically I would like the SVG to appear on the left side of the page, and the header and paragraph to appear on the right until the viewing window becomes too small and then to have the elements stack (in the order of: header, paragraph, svg).
I have two problems right now: 1. The header and text run on top of the svg (click on a node in the fiddle below to get the paragraph text to appear). 2. When the viewing window becomes very small, the text seems to disappear off the left side of the browser.
Here’s the jsfiddle: http://jsfiddle.net/westcoast_509/xgafy1to/
I’m still quite new to CSS/JS (and wasn’t entirely sure which forum I should post on) so I appreciate any tips or pointers you might have!
