Ingo Chao wrote:
>Leo Breebaart wrote:
>
>
>><http://www.kronto.org/test/>.
>>... The problem becomes apparent if you try to focus-cycle through
>>the links on the page by hitting the tab key. Not only does this
>>look ugly as sin, but more importantly: only part of the icon is
>>clickable. Dan's technique only works if the icon is not much
>>taller than a single line of text (and if you don't change the
>>background colour on :hover or :active).
>>
>>
>[...]
>Since the box of the A has a specified offset to the box of the LI, I
>think you could place another background-image on a:focus, matching the
>background-image of the LI
>
>#main ul li a:focus {
> background: #eee url('blank-button.gif') no-repeat 0 -6px;
> text-decoration: none;
> }
>
>Works for me in Fx.
>
>
Hi all,
Giving the <a>, a:hover and a:focus more padding enables to click on the
whole button (FF and IE). Then:
* In Firefox you see the dotted focus-line around the new defined
padding: a rather big grey-backgrounded rectangle (going across
the text under the text-link).
* In IE you see the dotted focus-line smaller: only on the line of
the <a> (as it was). Perhaps with fine-tuning this can be solved...
* In both: the background-color #eee (light grey) is showing in the
whole area when hovering or tabbing > but hiding the button.
See first testpage
<http://home.tiscali.nl/developerscorner/css-discuss/button-focus-a.htm>.
Better than a background color when hovering/tabbing can be a changing
button-image (txt-underline was already toggled).
See second testpage
<http://home.tiscali.nl/developerscorner/css-discuss/button-focus-b.htm>.
(still IE needs some fine tuning)
(seems FF did not allow the short color notation ?)
(a combined image for the two buttons - - shifting background-position -
- can avoid a flash when toggling)
(remark the white circle flash in the grey area of the button when
tabbing: optical illusion "negative after-image" -- don't know the
English term for it)
(btw: big difference FFand IE in the default sans-serif and serif fonts !!!)
Greetings,
francky
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
