Hi and hello everyone, I hope you are always happy wherever you are :)
I have a little problem creating a table that has responsive features, that is, when zooming in and zooming out, the width of the input will change and adjust.
The main problem is that when I zoom in, what I want is that the width of the input doesn't change, however, in fact the width of the input changes getting smaller
https://www.outsystems.com/forums/discussion/53919/editable-table-with-multiple-columns/
I have followed the tutorial from this post as well as implemented in my program, but the result still doesn't change,
Then, I also tried the tutorial from this post
https://www.outsystems.com/forums/discussion/64511/editable-table-styling/
However, the appearance has not changed either, I suspect that there is a css that needs to be added or something is wrong with my CSS
Here I attach a screenshot
CSS container
Width Table 120% And Width Column (Column 7% x 17cell = 120%)
When zoom out
When zoom in
Due to project privacy issues, I cannot provide my OML, but I hope that my friends and compatriots at Outsystems can help me, because the deadline is getting closer and my project is still not over due to this problem
Thank you very much
Thank you for your answer, I have tried it but it hasn't been successful, then I tried the method by changing the value of the input widget to a fixed value, finally it is more responsive when zooming in, the width does not decrease
Hi Syamsu, did you try to use position? set parent as relative and child as absolute passing the exactly place you want the element to be
Eg:.
#parentDiv { position:relative; }
#childDiv { position:absolute; left:50px; top:20px; }
Here you can find some explanation about position:
https://dzone.com/articles/css-position-relative-vs-position-absolute
https://css-tricks.com/almanac/properties/p/position/
Hope I could help you
Cheers,
Carlos Lessa