It seems like a large percentage of the problems that CSS newbies have is with trying to use absolute positioning to create their layouts. Often the cry goes up: "don't use absolute positioning" and then the requisite explanation of why it can be a bad thing. So I thought it might be a good thing to have something to refer to that might illustrate and explain why people should be wary of using absolute positioning. So here goes: Absolute positioning can be used to put together a layout quite quickly: by using values for top, right, bottom and left you can get everything exactly where you want it. The catch is that your layout will look great on your screen, at your window size and the text size you've chosen (not to mention OS), but as soon as someone else views your layout with any of those variables different from yours, things start to go wrong. To illustrate, here's a little example I put together: Every element on the page is positioned using position: absolute. Widths & heights are all in percentages to create a fluid layout while values for top, right etc. are all in pixels to get things exactly where I want them. The screenshot was taken at a screen res of 1024 x 780. So far, so good. Now let's take a look at the same layout viewed at 800 x 600. Or even just by pressing F11 in Firefox to get full-screen view (and thus a bigger window area): As you can see, things are moving around and overlapping where they shouldn't. This is because absolutely positioned (AP) elements are taken out of the normal flow of the document and have no impact on later siblings (elements that appear after them in the source but within the same container). Which means that AP elements have no awareness of what's happening around them. When a page changes size, the elements don't move in relation to each other but rather in relation to their container and the values you've set for top, left etc. And in most cases where newbies use AP to place layout elements, the container in which these elements are placed is the body itself, so when the body resizes, you get the above problems. So, OK, if that's the case, what do you do instead and why would you use AP at all? To answer the first: it's going to vary on a case by case basis, and this is more of a heads-up as to potential problems rather than an answer to specific layout questions. But, in general, when creating a layout, you should try and work as much with the normal flow of the document as possible. Let the elements themselves help position those that come after them. In some cases though, you will want to use floats. Floats are also taken out of the normal flow of the document but content will flow around the outside of a float, which is not the case with AP elements. Floats can also be cleared to have content appear below the area of the float. These two factors make floats a bit more flexible as a layout device than AP. So, when do you use AP? One case would be when you want something to remain the exact same distance from something else no matter how the text or window is resized. Another example comes from wellstyled.com and is used for more accessible image replacement. In most of these cases, however, the containing block is set to position: relative to establish a new positioning context of any descendant element that is then positioned absolutely relative to the containing block. So, the moral of the story is: AP can be a useful tool, but until you have a better understanding of the Visual Formatting Model, it is something that should be approached with caution. All comments or additions to the above are welcomed
The above post was copied from a four year old article on CSSCreator. While the real author might OK the reposting here, I'm not so sure he'd appreciate the lack of proper accreditation. gary CSSCreator moderator
now i realize what your problem is, gary... look at the top of this page...does it say csscreator forums? no, so stop trying to police this forum.
You've made it obvious that you're a newbie to social networking such as newsgroups, mail lists, and forums. Otherwise, you'd know it is every member's responsibility to point out such crap as the above example of plagiarism. Until you've been around long enough to experience a forum dieing due to allowing plagiarism, bad advice, wrong information, and just plain poor etiquette, you're not qualified to to comment. No group of moderators has the time to view each and every post, nor do they necessarily have the particular knowledge to judge the merit of a given post. So, if crap is posted, then a knowledgeable member needs to speak up. The concept of not saying anything if you can't say something nice is stupid and will kill off a forum by causing the more clueful members to leave in disgust. You're left with the ignorant leading the naïve. In this case, unless DP moderators are very familiar with CSSC articles, they would have no way to know the provenance of the post. As it happens, I do know that it's a copy, I have the evidence, and I called the poster out; I also reported the plagiarism to the admin staff here. In fact, this is at least mcdeere02's third instance of such stealing. I suggest you buy some clue. gary
That's what the report button is for, you fool. I have a forum and it's no big deal, contrary to what you believe, being a simple moderator.