How do I override Duda's fixed height on a HTML block?

Rhys
Rhys Member Posts: 8

While embedding a third party for (HubSpot), I noticed that the HTML block has a fixed height (what ever you drag the height of the container to be).

This causes issues on tablet where, when the form becomes squished, it pops out of the container. I need to set it to have "height: auto", but cant override the important tag Duda sets on the widget (which, it seems odd to me to have a HTML block set to a fixed height anyway?)

All I need is:

*#dm *.dmBody div.u_1876428906 {

 height: auto;

}

Tagged:

Answers

  • Aj_Cre8
    Aj_Cre8 Member Posts: 391 MVP

    Did you get this resolved??? It seems like all you need to do is continue to drag the container a little more.. There is no Default height for a widget. Most Duda widgets can be resized by dragging the blue node.

  • Rhys
    Rhys Member Posts: 8

    Hi mate, no solutions so far. Dragging the blue node is exactly whats causing the grief.

    By default, a custom widget or HTML block will be 100% tall, and responsive. But one you click that node, it becomes a fixed height, which is the same value assigned to desktop and tablet. The problem here, is tablet columns aren't as wide, so the content of the widget pops out - its no longer responsive.

    Even if I try to override the height value of the widget or the HTML block, I cant seem to get it to behave as such again. Dragging in a new copy of the widget seems to be the only option.


    Buts its specifically a problem that desktop and tablet versions have the same fixed height, when they often need to be different.

  • Aj_Cre8
    Aj_Cre8 Member Posts: 391 MVP

    I agree. That is an issue we have been pushing with Duda FOREVER AND A DAY. They then came out with flex, which is great and keeps getting better, but in regard to the classic editor, all three breakpoints should be separate. I do not see them investing time to make that happen though.

    To solve your issue, have you tried going into the HTML and CSS of the HTML widget and setting the height to 100% again, or auto?? To force remove the fixed height?