Advancing in CSS

[Amanda]

I have used CSS for some time now in my designs and templates. But I haven't moved to the CSS Layout. In other words I'm still using my tables. Gotta love tables!! I want to try to design a layout with CSS only. No tables. Anyone have any advice that they would share with me. I have read some tutorials but I think I'm just so use to the tables that it is hard to understand where to begin on the CSS layout. Thanks for any help.

Amanda

[herkalees]

Just dive into it. Make a fake site, or play around with your own site as a backup. You'll never grasp it until you do it.

[mreine]

There are two types of CSS positioning, static and fluid.

Static sites are pretty straight forward since everything gets set parameters. This is a good place to start. Study absolute positioning and the basic box model and your all set. Static sites can end up more elaborate since font sizes and browser widths will never affect the layout due to the set parameters. Just remember... 760px is your friend.

Fluid is a whole other ballgame and you won't find a lot of people doing them because it requires a lot of yelling, beating the keyboard and preparing your gun if the last css variable doesn't make something line up. I prefer fluid because it's a challenge. There are a lot of things you have to consider when doing fluid because it's a lot different then static. There are so many changing variables that it can be overwhelming. You will need a very detailed understanding of floats and a more thorough understanding of the box model dealing with padding and margins and how floating affects things. You need to fully understand fonts and how they relate to px's, em's and %'s. And this is just scratching the surface.

The other thing to remember, is that CSS/XHTML is about creating a well structured document. Learn about proper Headings, paragraphs, etc...

Good luck.

Another awesome friend is... W3 Schools on the net.

[Amanda]

Originally Posted by mreine

You will need a very detailed understanding of floats and a more thorough understanding of the box model dealing with padding and margins and how floating affects things. You need to fully understand fonts and how they relate to px's, em's and %'s. And this is just scratching the surface.

The other thing to remember, is that CSS/XHTML is about creating a well structured document. Learn about proper Headings, paragraphs, etc...

Good luck.

Another awesome friend is... W3 Schools on the net.

Hi, Thanks for your advice.. As for the px's, em's, %'s, I already use them. Also I use the floating for all my images so I don't have to use tables for them. I use the padding and margin too. I use CSS for my headers, buttons, rollover buttons, etc. So I am familiar with all of those. In other words I do use a lot of CSS in my web designs. Again thank you for your advice. I will take the next step forward.

[herkalees]

Originally Posted by Amanda

Hi, Thanks for your advice.. As for the px's, em's, %'s, I already use them. Also I use the floating for all my images so I don't have to use tables for them. I use the padding and margin too. I use CSS for my headers, buttons, rollover buttons, etc. So I am familiar with all of those. In other words I do use a lot of CSS in my web designs. Again thank you for your advice. I will take the next step forward.

I'd guess you're experienced enough to get a quick/accurate sense of laying out an entire site with div's and css. I wouldn't worry at all. Otherwise, we're here to help.