[Solved]-tooltip responsive inside a div - not showing-d3.js

i added a new div and wrapped your code in another div so all positions stay relative to eachother

the only new code i had to add was this:

  .on("mouseover", function(d) {

      d3.select("#centertooltip")
        .classed("hidden", false)
        .html(d.data.str_lab + "<br />" + d.data.num);
  })

and in the div wrapper css i added:

#all {
  margin:auto;
  width: 700px;
}

to make sure that everything aligns properly.

here's a fork of your code: plunker