How to combine two x axes using subplot

I have two plots (candle and bar). I want to combine them in the same subplot (x-axes in the top for volume and x-axes at the bottom for dates), but when I try to combine both in the same subplot (row=2, col=1), the result it's not the expected.

import plotly  from plotly 
import subplots 
import random 
import pandas as pd 
import plotly.graph_objects as go

fig = make_subplots(rows=3, cols=2)

high = 40
low = 5
dev = 1
days = 18

fake_market = []
for each in range(days):
    ohlc = []
    ohlc.append(each)
    if each == 0:
        o = random.randrange(low, high)
        ohlc.append(o)
    else:
        ohlc.append(c) #I know
    h = random.randrange(o, high)
    ohlc.append(h)
    l = random.randrange(low, o)
    ohlc.append(l)
    c = random.randrange(l, h)
    ohlc.append(c)
    fake_market.append(ohlc)

fake_volume = [[x, random.randrange(1, 200)] for x in range(low, (high+1))]
df = pd.DataFrame(fake_market, columns=["Date", "Open", "High", "Low", "Close"])
df2 = pd.DataFrame(fake_volume, columns=["Volume", "Price"])

fecha = ['2019-03-22', '2019-03-23', '2019-03-24', '2019-03-25',
           '2019-03-26', '2019-03-27', '2019-03-28', '2019-03-29',
           '2019-03-30', '2019-03-31', '2019-04-01', '2019-04-02',
           '2019-04-03', '2019-04-04', '2019-04-05', '2019-04-06',
           '2019-04-07', '2019-04-08']

candle =go.Candlestick(
            x=fecha,
            open=[str(x) for x in df.Open.to_list()],
            high=[str(x) for x in df.High.to_list()],
            low=[str(x) for x in df.Low.to_list()],
            close=[str(x) for x in df.Close.to_list()],
            visible=True,
            showlegend=True, 
            xaxis='x3', 
            yaxis ='y3')
        
vol_bar = go.Bar(
                x=[str(x) for x in df2.Price.to_list()],
                y=[str(x) for x in df2.Volume.to_list()], 
                xaxis='x4', 
                yaxis ='y4',
                name='volume', 
                orientation="h", 
                opacity=0.4, marker=dict(
                        color='rgba(246, 78, 139, 0.6)', line=dict(color='rgba(246, 78, 139, 1.0)', width=0.1)))

fig.add_trace(candle, row=2, col=1)
fig.add_trace(vol_bar, row=2, col=1)

fig.update_layout(
    yaxis3=dict(
        title="yaxis3 title", 
        titlefont=dict(
            color="#1f77b4"
        ),
        tickfont=dict(
            color="#1f77b4"
        )
    ),
    yaxis4=dict(
        title="yaxis4 title", side='right',
        titlefont=dict(
            color="#1f77b4"
        ),
        tickfont=dict(
            color="#1f77b4"
        )
    ),
    xaxis3=dict(
        title="xaxis3 volume", side='top', overlaying='x',
        titlefont=dict(
            color="#9467bd"
        ),
        tickfont=dict(
            color="#9467bd"
        )),
    xaxis4=dict(
        title="xaxis4 date", side='bottom', 
        titlefont=dict(
            color="#9467bd"
        ),
        tickfont=dict(
            color="#9467bd"
        ))     
)

fig.update_xaxes(rangeslider_visible=False)
fig.show()

The plots are showed as follow: The plots:

The result: The result:

The plot expected: The plot expected:

Apparently the x axes are mixing and that is the reason for getting a distorted graph is obtained.