I have been developing applications using C++ and other languages for years, and one thing that I just do NOT understand is positioning things on a page in HTML/CSS. I do know the other basics of HTML and CSS... I just can't wrap my brain around the positioning.
From Div's, to td's and tr's... It's just... Can somebody please help me understand how a website is laid-out using HTML and CSS?
Thank you very much.
P.S. I'm not looking for links as I've read countless articles and tutorials over the years and none of them have helped. However, if you feel that you have a link that can actually explain this to me, then please do send it my way. :)
As a C++ coder myself, I have had the same frustration. Here are some general guidelines. Markup is designed to work with many different media and each should be able to decide how it is rendered. For instance, a table may be viewed as a grid, but a browser may choose to display it on a separate page or as a different format altogether. Therefore, always keep markup and style separate.
Once you get to style, remember that positions are relative to the size of the page, which may change. Also, remember that pages are meant to expand vertically, so design with a top to bottom approach. If there is not enough room horizontally for an item, it will fall to the next line (think word wrap). Floated elements have no mass in relation to non-floated elements. I often break down and float everything.
If you are designing with Internet Explorer, expect headaches to come. I would advise that you first design for a standards compliant browser, then use hacks to make it work in IE. It plays by it's own rules and those rules are not well documented. Google IE box model bug.
Web pages are more about content than design (despite the latest trends), so aim for that first. When you have specific problems, ask specific questions. Often, while solving one problem, you learn what has been wrong with your thinking on other things.