WordPress.org

Make WordPress Core

Opened 8 years ago

Closed 8 years ago

Last modified 7 years ago

#1941 closed defect (bug) (fixed)

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

Reported by: Mr_Cynical Owned by: matt
Milestone: Priority: low
Severity: minor Version: 1.6
Component: Template Keywords: css bg|has-patch
Focuses: Cc:

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 (3)

footer_misalignment.png (33.9 KB) - added by Mr_Cynical 8 years ago.
The problem as displayed by the 2.0b1 CSS
fixed_problem.jpg (132.6 KB) - added by Mr_Cynical 8 years ago.
The result of the CSS change I suggested
fixedkubrickfix.diff (2.5 KB) - added by spencerp 8 years ago.

Download all attachments as: .zip

Change History (14)

Mr_Cynical8 years ago

The problem as displayed by the 2.0b1 CSS

Mr_Cynical8 years ago

The result of the CSS change I suggested

comment:1 Mr_Cynical8 years ago

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

comment:2 Mr_Cynical8 years ago

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.

comment:3 Mr_Cynical8 years ago

  • Milestone set to 2.0

comment:4 matt8 years ago

  • Milestone changed from 2.0 to 2.1

comment:5 davidhouse8 years ago

  • Keywords bg|has-patch added

comment:6 markjaquith8 years ago

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
  1. Load WP front page with default theme
  1. SLOWLY change the width on your browser, we're talking about 2px a second changes.
  1. 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

comment:7 davidhouse8 years ago

  • Priority changed from normal to low
  • Severity changed from normal to minor

spencerp8 years ago

comment:8 matt8 years ago

  • Owner changed from anonymous to matt
  • Status changed from new to assigned

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

comment:9 matt8 years ago

  • Milestone changed from 2.1 to 2.0.4

Also needs backporting.

comment:10 ryan8 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

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

comment:11 anonymous7 years ago

  • Milestone 2.0.4 deleted

Milestone 2.0.4 deleted

Note: See TracTickets for help on using tickets.