Hello community,
I've a problem with the layout when I build and run the application. As you can see in the picture, the layout is quite a mess. In my development environment everything is looking fine.
I've had this issue before, but now I can't seem to fix this. Should I use static, relative, absolute or fixed position? And what should I do with the margin options.
Thanks in advance.
The layout within the development environment is looking like this:
You have probably used absolute positioning which depends a lot on the browser size. We can't be sure based on a screenshot.
There is no generic answer to this question. Every position has its own uses otherwise they wouldn't exist. More info about CSS positions is available here.
Again it depends on the requirements. CSS margins are explained here.
To avoid differences between screen sizes I would recommend to prefer margins than absolute positioning. Or if you must use absolute positioning make the parent component with relative position. Then absolute positions are relative to the parent.