how to match widths of two html dygraph plots while using htmltools::tagList

Question

I use the excellent dygraphs package in R all the time. The synchronized plots work great but I am having difficulty in keeping the widths of the two synchronized plots identical when one dygraph has data only on primary axis while second has primary + secondary y axis both plotted. The "y2" axis labels reduces the width of the chart 2 thus throwing the x axis of both charts out of sync.

Take a look with the following toy example:

library(data.table)
library(magrittr)
library(lubridate)
library(dygraphs)
library(htmltools)

# create 2 small data.tables.
dt1 <- data.table(datetime = seq(ymd_hm(202205100800),by = "1 mins",length.out = 50))[order(datetime)]
dt2 <- data.table(datetime = seq(ymd_hm(202205100800),by = "1 mins",length.out = 50))[order(datetime)]
dt1[,temp1:=rnorm(50,10,0.5)]
dt2[,temp2:=rnorm(50,7,0.5)]
dt2[,power:=rnorm(50,100,0.5)] # scale is higher hence will be ploted on the secondary access.

d1 <- dygraph(dt1,group = "X")
d2 <- dygraph(dt2,group  = "X") %>% dySeries("power",axis = "y2")

Now I combine the two charts using htmltools::browsable() function. I am open to use any other function to combine the two plots so long as they can be one html document.

browsable(tagList(d1,d2))

As you see the two charts are a little displaced. I would like the two x axis aligned exactly.

Thanks for reading and replicating my example !