Positioning modal close button

I've added some code to a modal header that allows me to have a multiline heading. It requires the use of the d-block class on the modal-header div.

When I do this, the close button ("X") moves down to be under the heading. I can see the button definition in the html but it's not listed in the overview panel so I can't move it so it's still at the top right.

I have a code snippet from elsewhere in on the web that shows that the close button can be anywhere you want it to be within the header so why does BSS not allow me to move it? Bug? Oversight?

post your code.

I just published a website with many modals, including some that had a multiline heading. No problems.

As a test, I also added a d-block class div with a few paragraphs inside, and everything works fine. The close button is still at the upper right corner.

enter image description here

Glad it works for you but that's not the point The issue is that BSS does not allow me to position the close icon wherever I want it to be or even omit it completely if I want to. This is another example of BSS being somewhat over stringent in not allowing certain valid html/Bootstrap constructs, not sure whether by design or oversight. I posted another example a week or so ago where BSS does not allow me to drop a form into a dropdown menu which as of Bootstrap 4 is perfectly valid. I think BSS is a great tool but constraints like this force me to edit the exported html which means I can't use BSS to make any further design tweaks, unless I want to re-apply all my edits.

Solution is to build your own modal component using dragging in divs etc and then adding to your component library

That’s what I would do

Sure I could do that but it seems like a lot of effort to recreate a component BSS already provides. What I'm trying to understand is why BSS doesn't list the close button in the overview panel and allow it to be repositioned or deleted, that's my real question.