Hello. It's me again with another question that should generate a lot of responses (hopefully).

As mentioned before, I'm working on my first site (hopefully I'll be done soon and can move on to other stuff...caus I'm tired of looking at the same graphics).

But, I've been running into all of these different HTML/CSS code debacles, after which I've been advised to go back and "add 'this' default coding to your stylesheet", or "IE sees your code like this...Mozilla/Firefox sees it as this, so you have to do 'this' "....

Only to come to the conclusion that there are some general things that I need to do or code that I need to always include that will make my life a lot easier when I been using positioning code and other CSS elements to create my webpage.

From your perspective, what would be these general inclusions...? What do I "always" need to do so I won't have problems coding and my viewers won't have any problems viewing my page? (No graphic design answers needed).

Nothing at all.

Use a full and valid doctype, design your layout and test it with FireFox. 99.9% you will find that most other browsers will behave themselves and your layout will look pretty much the same in them all.

DON'T get prissy about minor differences, a pixel here, three pixels there. Therein lies the road to madness. If it ain't broken don't worry about it.

But I'm being told that there are some things to include.

Such as setting everything to zero so you won't have any positioning problems...

* {border: 0; margin: 0; padding: 0;}

I've included this in my stylesheet and it has made a difference...

What are some other things?

These kind of things become a matter of personal preferences and you build up a library of settings and files to use on every job. It's a bit like setting colours and fonts in your code editor.

Such as;
I never link stylesheets and external scripts directly in a page, I have a include script that I can code to pull different stylesheets in for different sections of a site. The code also checks to see if a local style sheet (to the folder) should be referenced.

If you prefer to have the margins, padding and border set to 0 then do that, but it's not something you HAVE to do.
It maybe that you prefer to use the Arial or Geneva fonts for your pages so you would have that as a global setting, or the text size is slightly larger as a default. Things like that you decide what you are going to do, not do what someone else finds easier.

I have to differ from Chris on the margin and padding thing. Because there are so many bugs in IE6 and below that you have to watch out for, many triggered by margins and/or padding (IE's busted box model), it's easier to 'level the playing field' by zeroing out all margin and padding from the start, then add it back in where you want it, and not have to scratch your head figuring out where the 'mystery' space is coming from.

LayneMitch I have some things I tend to do now when I start any site, but most of them are just things I discovered I do often over time. The margin and padding thing is one.

But don't feel like you have to start out specifically doing something. In fact in the beginning it's sometimes good not to know all those things. Yeah, it will mean that sometimes something won't be working right and you'll be frustrated, but that frustration and then eventual figuring out what you were doing wrong ends up making you a much better coder.

And we'll all be here to help you figure out some of those things.

Even though there are lots of things I now do on most every site, there really isn't much you have to do. Don't shoot for perfection from the start. The mistakes you make along the way are the best thing that can happen to you.

What you'll find is you'll get your first site done and then when you work on your second one it will be a little bit easier. The third one will get easier too. You'll also start to think of ways you could have done something better on previous sites. In time you'll have a bunch of things you'll do on every site, but it's ok to build a site without that list of things.

You'll find you learn things as you code more and more pages that work for how you code.

At the present time, I use PHP and include sections of the page. One for the header and another for the footer. But the header can include a left side bar and the foot a right side bar. For a menu I may include files in the include file. (That is much simpler than it sounds). For instance in header.php, I have variables and then include variable. The variable can be set in each individual page. Hope that makes sense.

I also divide my CSS files into divs.css and styles.css divs is for layout and to style the page, styles to set some classes (that don't directly relate to div's) and general styles like a tags that aren't directly set in a div.

Just practice and find out what works for you.

Just wanted to say thank you for the different views to all of you. I have a much better idea of how to approach web design now.

The whole "design in FireFox" and fix for other browsers after is a silly suggestion. Always has been, always will be. The great irony is that the suggestion comes about because people get pissed off when sites are built for IE first and then everything else after, yet they pull off the exact same behavior in reverse. It's silly for the IE people too, but at least the ones that do that start with the majority browser first.

Here's how I do it: first of all, I have IE7, Safari for Windows (arguably the ugliest browser in existence today) and Firefox open all at once.

I start with a blank page as far as code goes.
I do a section. I check it in all three.
I do another section. I check it in all three.
I do a third section. I check it in all three.

And so on and so on.

If you do this right, and you get it working in all three of those, you may end up having to apply a hack or two for IE6 and older browsers afterwards...but you usually won't, especially after you get used to each browser's quirks and develop ways to avoid them (learning those comes with time and experience.)

Hi,

I don't agree with Adam on this point : i start with Firefox, but i don't mind if anybody starts with IE; i simply don't think it's the right thing to do.
We know that ie6 has a lot of css bugs (and some in ie7, but much less); would you try to put a nail in a wall while wearing deforming glasses (at this moment, you know that those glasses are deforming), if you had a normal pair of glasses nearby ?
I test using Firefox cause i think you can't use something as a reference if you already know it's false. Plus IE bugs are known and their workarounds too, so IF you encounter an IE bug, you know how to treat it jus for ie, with a simple conditionnal comment.
And making things in firefox first doesn't mean making them ONLY for firefox.

Adam the reason many of us say to code for Firefox first is that in doing so you develop to the standards instead of IEs quirks. It's much easier to take something that works in Firefox and tweak it to work in IE. Often the only way to fix things the other way around is to start over from scratch.

I use Firefox as my primary browser and have some extensions I use to help me develop sites. Firefox is as much a development platform to me as a browser alone. I write some code checking in Firefox as I go and periodically check IE and other browsers.

...and how is that any better than using both at once, side-by-side? This is what most designers/developers miss completely; you generally won't need as many hacks if you just look at things from as many angles as possible in the beginning.

I tend to do both or either, depending on how the layout is.
A fairly simple layout where I would know roughly what to expect from all browsers would be just looked at in FF until complete, then just checked over in the others.

Something more complex or where the content would be very variable, would get a section by section check in all browsers side by side.

Both methods serve me well and rarely would it take more than a few hours to go from a jpeg/psd layout to a HTML/CSS coded page. The back end coding might take up some time however

It really isn't any different than having both open at once. It's just a pain to me to go back and forth between each browser every time I save a line of code. So I check Firefox each time I want to see how something looks and then periodically check IE when I reach the end of a block of code.

Maybe I code the nav bar. I check in FF while developing and when I finish the bar I check IE.

I think that's what we're really saying with checking FF first. Most new developers tend to build a site to completion only looking at IE and then ask how to fix for Firefox. Usually by that time they have so many hacks that the best advice is to start over.

If people develop and only check in FF it's much easier to then tweak for IE.

But I agree the best way is to check any and all browsers along the way. There are very few things you actually need to hack for any browser. A few things, sure, but not many. At most I end up with a half dozen IE specific lines of code. Most of the time I don't even need those.