The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Responsive line & points along that line

  • # May 20, 2013 at 11:50 am


    I’d like to create a graphic that is fluid, and is a dotted line from the side of the page, to a point near the top. Along that line I would like there to be points, with annotated bubbles. The trouble is, I need this entire graphic to be fluid without just scaling an image. Here is the photo:

    Is this possible with CSS and HTML only? Is it even possible with Javascript? It seems very simple but I am having a lot of trouble. Any help would be greatly appreciated.


    # May 20, 2013 at 12:14 pm

    This reply has been reported for inappropriate content.

    Maybe try SVG instead of png. Did you also try background-size: cover ?

    # May 20, 2013 at 12:39 pm

    I thought SVGs would be what I need. I googled around a bit and found this:

    For anyone else with a similar situation, it’s how to make SVG graphs responsive. I think this will help with what I need. I didn’t know you could manipulate them like this!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed