On Thu, 03 Jul 2003 08:29:06 +1200, Richard Grevers lists@dramatic.co.nz gave utterance to the following:
On 02 Jul 2003 21:46:00 +0200, Erik Moeller erik_moeller@gmx.de gave utterance to the following:
Richard-
I think it's highly confusing having the edit section link above and to the right of the section it refers to. Below and to the right would be the more natural position
I would like to have it displayed *right-aligned* with the section heading, and that's how it looks in Mozilla. The HTML used is
<div style="float:right;margin-left:5px;">[edit link]<div> <h2><a name="Anchor name">Page title</a></h2>
I just checked in Moz 1.4a, IE6 and Opera 7 - the edit link is definitely higher than the header in all three - if I have the link right at the bottom of the screen, the Heading is off the bottom of the screen. This makes the link look as though it relates to the section above it. The following markup achieves what you were aiming for:
<div><small style="float:right;margin-left:5px;">[<a href="/w/wiki.phtml?title=This_one&action=edit&section=1" class='internal' title="This one">edit</a>]</small><H2 id="newcomers"> This is a very long heading that might clash with the float</H2></div>
i.e. transfer the float to the inline element small and make the heading a child of the div. Notice that I've also replaced the <a name> element with an id on the header, which is much more efficient and avoids problems with headers accidentally inheriting styling intended for links in some browsers.
More efficient still would be
<div class="editheader"><small>[<a href="/w/wiki.phtml?title=This_one&action=edit&section=1" class='internal' title="This one">edit</a>]</small><H2 id="newcomers"> This is a very long heading that might clash with the float</H2></div>
and then you can define .editheader small {float:right; margin-left:5px;} and skins can do groovy things like .editheader {outline:1px solid #ccc;}
Richard (really looking forward to the day when users can specify their own stylesheets, stored locally)
Following up to myself: I just discovered that if you add a border, the CSS margin-collapsing rules come into play and add default 1em top-margin to the H2. So in any skin where you wanted a border you would need to specify something like .editheader H2, .editheader H3, .editheader H4 {margin-top:0;} .editheader {border:1px solid #ccc; margin-top: 1em; padding: 2px 0.5em;}