Ticket #1941 (closed defect: fixed)

Opened 2 years ago

Last modified 1 year ago

Default theme CSS causing footer 'pixel shift' in standards-compliant browsers

Reported by: Mr_Cynical Assigned to: matt
Priority: low Milestone:
Component: Template Version: 1.6
Severity: minor Keywords: css bg|has-patch
Cc: webmaster@davidarussell.co.uk

Description

In Firefox the footer on the default (Kubrick) theme is shifted slightly, making it look pretty bad. It turns out that this is caused by the following section of Kubrick CSS: 

#footer {
	padding: 0 0 0 1px;
	margin: 0 auto;
	width: 760px;
	clear: both;
	}

That '1px' is the cause of the problem - it doesn't occur in Internet Explorer because IE doesn't fully conform to the CSS specification, and simply ignores the pixel shift. Changing that CSS to the following solves the problem: 

#footer {
	padding: 0 0 0 0;
	margin: 0 auto;
	width: 760px;
	clear: both;
	}

There has already been a Support discussion on this, and a Mozilla bug report which includes screenshots which may provide more information - but that simple CSS change would solve the problem.

Attachments

footer_misalignment.png (33.9 kB) - added by Mr_Cynical on 11/23/05 13:11:30.
The problem as displayed by the 2.0b1 CSS
fixed_problem.jpg (132.6 kB) - added by Mr_Cynical on 11/23/05 13:13:06.
The result of the CSS change I suggested
fixedkubrickfix.diff (2.5 kB) - added by spencerp on 06/26/06 12:49:28.

Change History

11/23/05 13:11:30 changed by Mr_Cynical

  • attachment footer_misalignment.png added.

The problem as displayed by the 2.0b1 CSS

11/23/05 13:13:06 changed by Mr_Cynical

  • attachment fixed_problem.jpg added.

The result of the CSS change I suggested

11/23/05 21:20:36 changed by Mr_Cynical

  • summary changed from Default theme CSS causing footer 'pixel shift' in Firefox to Default theme CSS causing footer 'pixel shift' in standards-compliant browsers.

11/23/05 21:27:22 changed by Mr_Cynical

It turns out that this was done deliberately (see Support discussion) but it is still a bug because the code does not display the footer as it is supposed to look when the CSS is interpreted correctly.

11/23/05 21:32:32 changed by Mr_Cynical

  • milestone set to 2.0.

11/25/05 22:49:58 changed by matt

  • milestone changed from 2.0 to 2.1.

11/27/05 13:04:55 changed by davidhouse

  • keywords changed from css to css bg|has-patch.

03/04/06 01:20:36 changed by markjaquith

I can confirm this problem, as well as confirm the fix.

One minor note... instead of: 

padding: 0 0 0 0;

It should be: 

padding: 0;

I also note that it only occurs on even-numbered widths. i.e. it happens on 800px browser width, but not 801px.

We need people to try this in other browsers.

Testing procedure:

1. Apply the patch

2. Load WP front page with default theme

3. SLOWLY change the width on your browser, we're talking about 2px a second changes.

4. See if the footer gets shifted and if you can stop resizing and "freeze" it in a misaligned state

Please state your operating system and browser. I'll get the ball rolling:

Confirmed fixed in:

OS X/Firefox 1.5.0.1 OS X/Safari 2.0.3

03/04/06 09:49:34 changed by davidhouse

  • priority changed from normal to low.
  • severity changed from normal to minor.

06/26/06 12:49:28 changed by spencerp

  • attachment fixedkubrickfix.diff added.

06/26/06 17:41:23 changed by matt

  • owner changed from anonymous to matt.
  • status changed from new to assigned.

I believe this is fixed in [3924], but needs browser testing.

06/26/06 17:41:49 changed by matt

  • milestone changed from 2.1 to 2.0.4.

Also needs backporting.

06/26/06 19:33:43 changed by ryan

  • status changed from assigned to closed.
  • resolution set to fixed.

(In [3925]) Default theme updates. fixes #1941

11/30/06 19:41:50 changed by

  • milestone deleted.

Milestone 2.0.4 deleted