CSS Tables vs Tableless

I'm working on the current site.

www.warcraftdownunder.com

Now the design was done by a mate and I just integrated it into the PHP/MySQL system.

It was designed with Tables and CSS.

I've never liked tables myself, and I was thinking of converting it to a tableless design.

The other thing I was trying to do, could someone either show me the code or a link to the code.

I'd like to have a images for a <div> for the top left, top right, bottom left, bottom right, plus left,right,top,bottom images that repeat, so if the site is getting resized, the boxes do as well.

Or is that a bad idea and I should stick to images being left/right and repeat them down etc.

If we take Bens attitude, we're all sick of discussing anything in the web design world, had enough off the CSS vs Tables debate... your banned
</rant>
I think you should try out a CSS layout, at least experiment and see where you will get, if you dont like tables as you said, then you'll never feel truly right with the site until it is how you want

Cool.

So is there a way to have borders that are images? Top/bottom, left/right etc? Without it being a table.

I think this is my major problem at the moment is trying to figure out how to do that.

I think I saw it in CSS3, but not sure in CSS2.

It doesn't work in the same way, i.e you'll be doing it with background images etc. but it can be done, Just requires some outside the box thinking.

Late reply, didn't seem to get the notification.

So it's all done with backgrounds...hmmm

Is there an example sites?

#foo {
width:;
height:;
background:url("foo.jpg") top left no-repeat;
}

Yea, sorry, I know how to do backgrounds, but how do I have multiple <divs> using backgrounds to make a border with corner images and top/bottom etc

Container div
top corners
content
bottom corners
end container div

Ok, I think, at least for now while Im still learning all this again, I'll stick with a simple table in this newer design.

http://www.digital-inn.com

I've been putting this together, how do I get the side parts to expand with the content in the middle?

I did a search but didn't really come up with anything I could understand, somewhere else said to use Javascript to make the heights of the <divs> the same.

Any suggestions?

You need a repeating image.
The content dictates how much it repeats.

The side parts are repeating, it's told to repeat anyway.

But they are in different <div> tags than the content, so the content pushes down further, but I thought the side parts would of moved down too.

If you need more info like a pic of my design boxes etc let me know, I'll scan them in somewhere.

No, I see what you mean.
You need to add 2 repeating side images which will scroll between the top and bottom images.

Not quite sure what you mean, I'm still trying to get a handle on this.

Could it be that I'm using position: absolute; in a lot of places?

Using absolute positioning can mess a lot of things up and also, in the worst case, get in the way of proper validation.

I, now, only use absolute positioning when I can see no other practical way of getting an element where I want it. I'm working on something at the moment that is fully fluid and fully resizable. After 2 days of trying different things I couldn't get the menu to do what I wanted so I used an absolute position. Luckily the site still works fine in all browsers and still validates as XHTML strict and CSS.

My main area of expertise is networking and servers etc, so CSS I'm still getting a handle on.

The design is pretty static in width, and has 3 columns in a warpper, all 3 columns use position:absolutes;

Is that not the proper way of doing it?

Any pointers are appreciated.

Regards

No, thats not really the best way... look here. On this page check out the liquid 3 column layout. Now this is best left as liquid for accessiblity reasons but if you have to keep it static just swap the %s for px values...

Ok I followed the 3 column Liquid floating stuff.

Still doing the same problem

I think I'm still doing something wrong.

Cheers.

http://www.newbeginningsdesign.com/samples/3_col_fluid/

Not perfect but functional atm. Hope it helps.

__________________
I hate IE 6. Just sayin....
http://www.mevans76.com

That was using floats for left and right etc.

I think it would be ok if I was using actual content in the side parts, but it's just a background to make the border of the real content in the middle.

If that is the case then all you need is a repeating background on the body element and your content to be centered as well.

__________________
I hate IE 6. Just sayin....
http://www.mevans76.com