My copyright right moves slightly from page to page? - Graphic Design Forum and Web Design Forum

ewwatson · #1 (**permalink**) 11-03-2008, 02:13 AM

Alright... I give up on this one. The copyright moves up and down by a pixel or two between different pages. Go from the Home page to the Diabetes page and look at the footer and you will see. I have tried changing the margins, padding, and line-height on the text in the footer. I can get it to temporarily work but as soon as I change anything above the copyright (i.e. in the #content div) like line-height, add text, and etc it moves the copyright between pages again. Basically the content div is pushing down on the copyright differently depending on the amount of text that is in the article. Because other than the text all the articles pages code is exactly the same. All the footer text is a PHP include if that makes a difference. Thanks for looking at it because I have been working on this for quite a few days now and it is buggin the ba-jesus out of me?

I have a theory, the footer (thats where the copyright is) is absolute positioned. Therefore it is taken out of the flow of the document. Could this be the cause of my problem? So if I were to place all the copyright and footer links within another div within the footer div would that bring those back into flow? Like if I gave that new div a position of static or something? Or is it out of the flow regardless because it's sitting inside of an absolute positioned div? Thanks a lot - here is the site in question

LITTLEABOUTALOT.com

zumojuice · #2 (**permalink**) 11-03-2008, 09:10 AM

To me, a movement like that would not be noticable unless I was looking for mistakes or someone pointed it out. I admit it must be annoying for you. Hang in there, there are some great CSS people around here, sadly I am not one of them.

ewwatson · #3 (**permalink**) 11-03-2008, 11:27 AM

Hi, I just found out it's only a firefox issue. In all the others the copyright does not move.

zumojuice · #4 (**permalink**) 11-03-2008, 02:42 PM

Figures....Though might be better in the latest firefox.

ewwatson · #5 (**permalink**) 12-03-2008, 01:52 AM

O-MY-GOD, I am going crazy! I just sat here for the last hour trying every different possible solution - nothing worked. I tried changing everything to absolute measurements, I tried placing it in another div within the footer div and giving it every different position, I tried taking the margin bottom away from the content div and putting another div above the footer of same height, I tried every different combination of line-height/padding/margin/negative margin in combo with padding, margin, and line-height. Nothing worked cross article.

The only thing they all have in common (the common being something changing the height of the copyright) is something above the copyright in the content div. That is where the problem lies. Unfortunately, I can find no differences between the articles - because there is none - the code is the exactle the same. UGH!

So basically I think I am focusing on changing something with the copyright, but the copyright is the effect not the cause.

ewwatson · #6 (**permalink**) 13-03-2008, 10:44 AM

I branched out - this problem now lives in eight different forums, and no body can find a solution. Here is what we have narrowed it down to now. It is most likely a rounding error, however, the copyright only moves when there is enough content to exceed the 100% min-height.

SuzyUK from over at WebMasterWorld Forum has been so kind, and really did some digging into the code. She did not find the solution but she did give me this - which is - a simplified working version, that recreates the problem with a minimal amount of code to trouble shoot. Hopefully this helps some one help me find a solution.

Here is SuzyUK code and part of what she said.
What I do know:
it only happens on pages with enough content to exceed the 100% min-height. The footer and paragraph themselves does not move it is simply the vertical-alignment of the text.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Short Page</title>
<style type="text/css">

</style>

</head>
<body>
<div id="wrapper">
<div id="content">
Diabetes, as it relates to blood sugar <br>
</div>
<div id="footer">
<p>some footer text</p>
</div>
</div>
</body>
</html>

To create the longer page, repeat the line in red approximately 32+ times - might need a few more. Now with 2 different pages open (1 long 1 short), click back and forth and look at the footer text - you will see it move.

ewwatson · #7 (**permalink**) 14-03-2008, 01:44 AM

Alright!!! Overflow auto on the footer and I gave the footer an em based height - that kept the vertical scroll bar away when you increase the text size. Done! Fixed!

I have to give SuzyUK (over at web master world) her credit though - I could not have done it with out her. We went back and forth 44 times.
footer text moves slightly from page to page?

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Web page Logo	PolarBear	Graphic Design & Web Design Critique	17	10-03-2008 07:45 AM
need web page	the ny lady	Design Forum Employment	18	26-01-2008 03:38 PM
New validator page	Toon	General Web Design Forum	9	16-08-2007 08:48 AM
Simple page	fedemorilla	Great Graphic Design	5	14-04-2007 11:58 PM
1st css page	Toon	CSS Forum	4	11-01-2007 09:05 PM