I’m not very skilled with CSS so this might be a silly question, but I’ll ask it anyway
How can I control a component’s (say, a Button) position dynamically from server side? For example, if I have a window with a chessboard like in the table example in the manual, and I’d like to put a Button representing a rook in the H1 square. In the server side state I have each pieces’ coordinates (eg. x=0, y=7 for the rook in H1). Layout-wise I’d have a VerticalLayout as the Window’s layout, and the table and the pieces are added to it.
What CSS magic do I need to get the Buttons positioned correctly on the chessboard?
GridLayout won’t work if I want to use a image as a backgound for the pieces. CoordinateLayout would be the correct solution though.
Anyway I solved it 5.3 way by creating a few class names I add to the buttons. One adds “position: absolute”, and the rest specify the coordinate → pixel offset mappings. A little kludgy I guess, but it works.
Hmm, I’m not following: why is GridLayout out of the question? Do you want to have a background for the GridLayout that represents the checkered board, or what was the problem?
Because I can’t see a reason not to use GridLayout here. Your solution is not so much of a kludge, but maybe a bit heavy to maintain (e.g. your piece size changes, and you have to rewrite all coordinates in your CSS).