Bootstrap's Column Width

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

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;” ]
1 Like

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).

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.