On Fri, May 28, 2010 at 12:43 AM, Rob Lanphier <robla(a)wikimedia.org> wrote:
What we're struggling with is that the
"[review pending revisions]" with the
little lock icon beside it to look right in a cross-browser and cross-skin
fashion. A couple of the problems we're seeing:
1. In Vector, the placement of the text can be too high or too low,
depending on the browser in use
2. In Monobook, the problem is even worse. For example, in Chrome on
Linux, the text hovers way up above article, covering up the "My
contributions" link, for example
Try just putting your div right before the <h1 id="firstHeading"> or
equivalent, and float: right it. You can put some margins or padding
on the top and/or right to adjust it a bit if you like. Something
like that should work. This will be much more reliable than trying to
absolutely position it, because different skins will use different
heights, and the heights won't be consistent at all in the face of
things like site notices.
On Fri, May 28, 2010 at 6:53 PM, Rob Lanphier <robla(a)wikimedia.org> wrote:
I think this is the crux of the problem. From what
Aaron tells me, Monobook
and Vector are already using different offsets here. I've not had a chance
to do a deep dive myself, so that I think you've identified what's the most
challenging here. This is one of those areas in CSS where different
browsers handle things very differently, so getting this right has been a
bit of a mess.
This is CSS 2.1. All browsers we care about should handle it
interoperably except for possibly IE 6 and 7. I see pixel-perfect
identical results in recent Firefox, Opera, and Chrome on Linux for
your Backmasking page. I even booted to Windows to check in IE8, and
that was basically identical, just as it should be. (Not quite
pixel-perfect, but seemingly only because different fonts were used.)
Only in IE6 does it look correct -- in all the others it's
mispositioned in exactly the same way.
You're not developing for IE6 and then trying to port to other
browsers, are you? You should be doing the reverse.