demonhale — Sat, 02 Jun 2007 02:41:25 +0000

Never had problems with absolute positioning either, just prefer the negative margins if all else fails...

teammatt3 — Fri, 01 Jun 2007 17:43:05 +0000

Yeah using absolute positioning is making more sense to me to. Setting up those margins is proving to be a pain in the butt. I was hoping there was a way to do it with floats but it doesn't look like there is. CSS should have a "sink" to go along with "float".

Megan — Fri, 01 Jun 2007 14:13:56 +0000

I've never had a problem with absolute positioning - always works well for me but I'll check out that link. To me positioning makes a lot more sense than negative margins...

demonhale — Fri, 01 Jun 2007 04:02:22 +0000

Yep, absolute positioning is very popular on themeing sites so they can put their banners in the top left or top right of your browser window... I usually stick with negative margins for positioning elements the way I want it to, I tried the same experiment you're planning teammatt, my results we're inconclusive, but using appropriate header tags seems to do the trick, and putting excerpts of contents on top... Please post your results of this experiment...

webwiz — Fri, 01 Jun 2007 02:05:04 +0000

Megan said:

Quote: I'm a little fuzzy on why people have such a problem with absolute positioning

It's not people that have problems with absolute positioning, it's browsers.

example: http://www.positioniseverything.net/posbugs.html

FWIW - absolute positioning takes an element and "lifts" it off the page, as it were. The rest of the content knows nothing about it. If the element is large, changes to content, text size, window size etc. can easily "break" the page as the absolutely positioned element may then cover other parts of the page.

OTOH - it's great for things like positioning corner images in - well - the corner.

Cordially, David

Megan — Thu, 31 May 2007 20:36:05 +0000

I've heard differing opinons from SE experts about whether source code matters. Some say yes, some no (that text towards the top is given more importance and links crawled better etc.). I think it often makes more sense when the page is viewed without a stylesheet, which happens in old browsers, mobiles, and for alternate devices sometimes.

This is an interesting idea for doing it without absolute positioning (I'm a little fuzzy on why people have such a problem with absolute positioning, not that I think it's super-great or anything, just unaware of rationale against it, haven't had a chance to read the info about that... )

teammatt3 — Thu, 31 May 2007 19:07:47 +0000

Yes! Thanks webwiz, the margin will do it. Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
width:778px;
}

#top {
	background-color:#000000;
	margin-top:500px;
}
#bottom {
	width:777px;
	background-color:#898989;
	margin-top:-250px;
}
</style>
</head>

<body>
<div id="top">
	<p>please be on the bottom: this div is on the top in the source code</p>
</div>

<div id="bottom">
	<p>this div is on the bottom in the source code</p>
</div>
</body>
</html>

The reason I want to try this is to experiment with placing the main body content first in the code, the navigation code, and then the header, and footer to see if that has any noticeable affect on search engine rankings. Sometimes Google will display the header part of the content (stuff like the site title and slogan) for the description in the SERPs. If the main page content was first in the source code, then at least Google would grab some interesting stuff. I just want to play around with that idea.

webwiz — Thu, 31 May 2007 17:25:59 +0000

Well, I suppose you could give the first DIV a large negative bottom margin to pull the second DIV up an appropriate amount, and make room with a positive top margin. But why would you want to do this?

If you could give us a use case, or post an example, we may be able to be more helpful.

Cordially, David