Okay I went for the div approach now.
So I have a div enclosing everything in my HTML body using the style
width:2048; height:1024; background-image:url("images/bumper.png");
and in that, I have my blind table which is now just a single column with 4 cells, header at the top, navbar underneath, then the content area and finally the footer.
bumper.png is a new image, since my blind table is 1024px and each bumper is 512px wide, this one has a width of 2048px. In the left 512 horizontal pixels, it has the left bumper, then 1024 transparent pixels to be overwritten by the blind table, and the last 512px are the right bumper.
My blind table uses the style
margin:auto; padding:0; border-spacing:0;
This works in the sense that I have the background image for the HTML body set to the tiled starfield, then I get the bumpers (from the div's background image) drawn and blended over that nicely using an alpha channel, and in the middle I have my table centered.
The problem is the div itself isn't centered. I tried with the HTML center tag as well as with adding a
style, but this only, apparently, centers the contents of the div. The problem is that, when I view this site with the aforementioned dimensions in 1920x1080 screen resolution, I get a scrollbar at the bottom which is all the way left. Accordingly, I see ALL 512 horizontal pixels of the left bumper, then the table, which is offset a bit to the right and not centered 100% and then a little bit of the right bumper! I still need to have the left and right bumpers cut off so that I always have my table in the center, even when resizing the window.
Is that doable? Thanks again for your continued help, this is a lot better already!