I wanted to rebuild my band site because I was tired of the old one. Instead of going more elaborate like I usually would, I wanted to take a retro simplistic (for me) approach so I decided I would use a few tables. Html tables. It seemed like an easy idea at the time. I would slap a few tables together and have a new cleaner version of the site up in a few minutes. And really, in Firefox it worked. It was up in a matter of maybe 30 minutes. Then I checked it in IE. Oops. I forgot about all the problems with IE and tables and it's not seeing height and so forth and having to put in spacers, and the centering the entire table issue.... I ended up nesting several tables to get it to work right and honestly I ended up wasting several hours on the blasted thing. Now, of course, I hate it and I don't want to build any more of it because I'll have the same issues I did on the first two pages on every page, so, I changed my mind and I want to go back and redo it in friendly CSS the way I should have done in the first place. SO, after that long winded explanation, I have a question! Do any of you guys know of anything that will easily convert html tables into CSS? Yes.... I can go in and do it by hand but, I just spent all that work on it so I was hoping for an easy way out. I'm betting there probably isn't one though....

-Bonnie

Say no to tables

Use divs and CSS

You can wrap the content just like you wrap it in tables but it's alot cleaner and basically better.



You're using a template right?

Hello! Yes. Usually I use CSS, but this time I used tables. Dumb, I know... But what I was hoping was that someone knows of an easy way to change tables to CSS.... What I'm finding out after hours of searching Google is that I am stuck building the CSS instead. I'd rather use a separate CSS template anyway.

What did I learn for this experience? There are no shortcuts!!!! Do it right the first time! That's my lesson for today for myself.

I guess it's a good thing I love making webpages.


-Bonnie

Okay... I did the conversion by hand and frankly it only took me about a half hour. I don't know why in the world I thought it would be easier to use tables.

Here's the results:

Old version with Tables:
http://orphicendeavors.com/indextables.html

New version using CSS:
http://orphicendeavors.com/

I actually got it to look better in CSS. (I haven't redone the music page yet because I want to completely change it.)

Anyway, I learned something out of this experience, so it wasn't a complete loss of time.
I learned you can't cut corners and save time by going backwards.


-Bonnie

You can center it in CSS with

margin:auto;

I did that at first and it looked great in Firefox but it didn't work in IE for some reason so I decided to skip it and leave it in the corner. I could have taken the time to figure it out but I'm not really happy with the background graphic yet so I knew I was gonna have to change it anyway. Is there a fix in IE for centering or should "margin: auto;" have worked?


Always learning....
-Bonnie

Ha! I got it!

body

text-align:center;
margin: auto;



#container

margin-left:auto;
margin-right:auto;
text-align:left;

Now it should look the same everywhere. (I hope. )

-Bonnie

The container around item (that has margin:auto) should be width 100%, but text-align works too.