CSS - Designing In Css

Hello! i am new to this forum and new to this whole html css thing also. But reading through these forums and a couple books has helped me alot. I just had a question that i have not been able to find the answer to. When you first start building a site, do you have all the design elements squared away first? or do you do all the coding first? (when designing with CSS). I am at a stage where I know what i want me pages to look like and have even started on the basic coding but was just curious if i should take a step back and design all the graphics that i will have on my site. Thank you in advance!

hey..

i have this design



where i need it to do this http://www.456bereastreet.com/lab/cssframes/

only in the orange field where there is a login form on the picture..

but i can't get it working.. so i am very stock..

plz help

I am new to design but really doing my best to keep up with the big boys. I am trying to tweak my site on Wordpress to have a oversized, and fluid footer.

Long story short I want my site (sac247[dot]sacobserver[dot]com) to have a footer that looks like venturebeat[dot]com or mashable[dot]com. Can someone help me get started on how to break my colors out of the widget box?

Sorry if I'm being repetitive, this has been discussed before, but still there is something preventing me from making CSS boxes behave properly.

Everything has to do with stopping <TABLE> and starting <CSS>-based thinking. I mean, there shouldn't be so much magic and wonderdust as I trick myself into believe.

My problem is very simple;

I'd like the design to do the following:
[wrapper: full width, 5px padding all over]
[variable size image container, 2 px padding all over, staying on the left at all times]
[variable size text container, staying on the right at all times, stretching full width so it touches the image container]

Here's an example of the design:
Code:

------------------------
|      (wrapper)       |
||------||------------||
||image || text       ||
||------||------------||
------------------------

I thought I had it made when I read that you basically can look at creating a table based design as using a combination of DIV's and SPAN's, havind the DIV's being looked at as rows and SPAN's as columns/cells. But for some reason I can't seem to get the full grip out of it.

I've had *some* success with this, but I'm having horrible problems with making the text get to the top left of the container. It *always* stays at bottom left, no matter how I adjust my DIV's, SPAN's or properties of those. I can't seem to make the boxes have any actual "space"; when I add margin properties to either box, I can't locate it, it's as if the container isn't there. I can get the wrapper to behace though.

While I'm at it, is there some good, solid, documentation of how the boxes work and interact? I've read *alot* of different articles, looked at w3c, checked other peoples code (which actually have teached me the most), but I'd like to have some kind of resource that gives me the knowledge of "box modelling" to such an extent that I should be able to solve in not all but most problems, like this simple one.

Thanks for taking time to read through all this. I know it won't become a FAQ or rooted topic, but I'm hoping perhaps someone with the same problem as I have will benefit from this.

I am curious to know what many of you think about the design consideration for 800 x 600. I am about to start a major project and am considering going to a fixed width of 1024 instead of my current default of 770. As I see it only about 1 of 10 use 800 x 600, and I think that will go down in the not too distant future. I wouln't mind learing how to scale a site so it looks good in any resolution but as I understand it you can not scale images that many of my site layouts depend on. Tom