Bootstrap's Column Width

[philcremer]

I’m having a lot of component UI trouble trying to keep columns width static in my UIs.

I know KNIME uses the Bootstrap method of 12 possible columns which could occupy:

“widthXS” : 1
…
“widthXS” : 7
…
“widthXS” : 4

and each column occupying a percentage of the width of the window.

Question: Is there a way to make column 1 static? Like “width: 100px;”?

Any thoughts?
Phil

[MartinDDDD]

Hey phil,

by now means have I played around with this and based on the detail you are providing you likely already came across this piece of documentation that references “additionalStyles”:

https://docs.knime.com/latest/analytics_platform_components_guide/index.html#_row_1

One thing that might be worth a shot is to pass in (although you may well have tried that already…)

"additionalStyles" : [ “width: 100px;” ]

[philcremer]

@MartinDDDD

by now means have I played around with this and based on the detail you are providing you likely already came across this piece of documentation that references “additionalStyles”:

Thanks for your quick reply. Yes I did. It didn’t seem to do it. I tried the width trick inside the columns and content. It didn’t respond to the columns, but it did keep the content static. Unfortunately, the columns are what’s messing everything up.

. . .
“parentLayoutLegacyMode” : true,
“rows” : [ {
“type” : “row”,
“columns” : [ {
“additionalStyles” : [ “border: thin solid green; background-color: yellow; width: 100px;” ],
“content” : [ {
“type” : “view”,
“autoResize” : false,
“useLegacyMode” : true,
“resizeTolerance” : 5,
“scrolling” : false,
“sizeHeight” : true,
“resizeMethod” : “viewMax”,
“sizeWidth” : false,
“nodeID” : “11”,
“minWidth” : 100,
“maxWidth” : 100,
“additionalStyles” : [ “border: thin solid pink; background-color: purple; width: 100px;” ]
} ],
“widthXS” : 1
}, {
“additionalStyles” : [ “border: thin solid blue;” ],
“content” : [ {
. . .

The purple shows the content (widget) stays at 100px but does not effect the columns (in yellow).