Prob: Resizing window stacks inline divs ?

programming web dev
1

Hello & Thanks ;
Prob : Resizing browser window stacks inline divs ?
How can I prevent this behavior ?
The divs are “display: inline-block;” .
I want divs to remain side by side .
Code is 207 lines long , so perhaps see it here :
http://vmars.us/ShowMe/vmTemplate-2Parallel-Tables-P-Editable-BEST-UnClutter-No-PP.html

Thanks

2

One solution would be to prevent our outer row from growing too small:

.RowH1 {
    display: inline-block;
    border-style: solid solid solid solid;
    border-width: 2px;
    border-color: black;
    margin: 8px;
    min-width: max-content;
}

The min-width property you see above will ensure the outer container never gets small enough to cause the inside div elements to have to stack.

:desert_island:

3

Thanks kirupa ;

    .RowH1 {
        display: inline-block;
        border-style: solid solid solid solid;
        border-width: 2px;
        border-color: black;
		margin: 8px;
		min-width: max-content;
    }

Works Perfectly !