Q: images are not shown at given positions when included margin-left and margin-right I'm showing some images on the chart. They are showing fine but issue is when included the margin-left and margin-right to give some space to show the chart.
included css code:
#chart1 {
        margin: 0 auto;
        overflow : hidden;
        margin-left: 60px;
        margin-right: 60px;
    }

js code:
Below js code is used to show the images at a particular location on the chart.
The below code works when the chart is occupied to 100% , but when included the above css code, the image positions are not shown at given timeframes..
overlay.style.left = (overlayBounds.x / (timelineWidth / 100) ) + '%';


A: Try overlay.style.left = ( overlayBounds.x / timelineWidth ) * 100 + '%';

A: #timeline {
  position: relative;
}

Then you will need to update 
.overlay {
  ...
  margin-top: -10px;
}

