disguising links as buttons

Tim <admin (AT) sheerhell (DOT) lan> wrote:

Being deliberately deceptive is not in the interests of the user.

Klaus Schulz <klsgfx (AT) yahoo (DOT) de> wrote:

Normally I would agree, but this is going to be an application for a
closed circle of users. (Replacement for a software they used
locally).

I think (in this case only!) it would be more confusing for the user,
to explain why this here is a button and that there is a link ...

It is not meant for tricking the user but to give him something he
remenbers.

Food for thought: Unless it works as a direct replacement (in exactly
the same way), or in an immediately intuitive manner, you might be
creating a new problem.

--
My "from" address is totally fake. The reply-to address is real, but
may be only temporary. Reply to usenet postings in the same place as
you read the message you're replying to.

On Mon, 29 Sep 2003 00:07:35 +0930, Tim <admin (AT) sheerhell (DOT) lan> wrote:

Tim <admin (AT) sheerhell (DOT) lan> wrote:
I think (in this case only!) it would be more confusing for the user,
to explain why this here is a button and that there is a link ...
It is not meant for tricking the user but to give him something he
remenbers.

Food for thought: Unless it works as a direct replacement (in exactly
the same way),

ok, this is not possible, using only HTML and CSS..

or in an immediately intuitive manner, you might be
creating a new problem.

I am aware of this. That's why I am trying to do it this way.
Hmm...
But I will re-think my way. Perhaps you're right and I am on the wrong
way...

Food for thought, ok.

Klaus
--
Woody Allen
I will not eat oysters. I want my food dead. Not sick - not wounded - dead.

On Sat, 27 Sep 2003 23:46:55 +0100, "William Tasso"
<news27 (AT) tbdata (DOT) com> wrote:

This is one I used recently:

#button {
margin:0;
display:inline;
color:#fff;
background-color:#f00;
text-decoration:none;
font-family: tahoma;
font-weight:900;
border:1px solid #fff;
}
a.button {
color:#fff;
background-color:#f00;
text-decoration:none;
font-size:1em;
font-weight:900;
font-family: tahoma;
padding: 0.5ex 1ex;
border:1px solid #fff;
}

I'd like to know what shortcomings it has - if any in your application.

I will try it on Monday and post the result...

Klaus
--
Dennis Hopper
"Ich musste immer wieder aus Scheiße Gold machen, wenn Sie verstehen,
was ich meine."
Aus alert #6 · März 2002 · www.alertmagazin.de

Hello,

I hope you still read this thread. I am a little late.

"William Tasso" <news27 (AT) tbdata (DOT) com> schrieb:

This is one I used recently:

#button {
margin:0;
display:inline;
color:#fff;
background-color:#f00;
text-decoration:none;
font-family: tahoma;
font-weight:900;
border:1px solid #fff;
}
a.button {
color:#fff;
background-color:#f00;
text-decoration:none;
font-size:1em;
font-weight:900;
font-family: tahoma;
padding: 0.5ex 1ex;
border:1px solid #fff;
}

I'd like to know what shortcomings it has - if any in your application.

None more than the css I used. In IE and Opera buttons look fine just
as I want them to. In Mozilla the buttons are to small if the text
used is only a fews letters. So same result as with my css. Sorry.

Klaus

"Klaus Schulz" <klsgfx (AT) yahoo (DOT) de> schrieb im Newsbeitrag
news:tva8nvc8vvk6qnrqphdnoqemtuntuu8m6q (AT) 4ax (DOT) com...

Hello,

for a project I am currently working at, I have to use form-buttons
and normal links (a href...) in the same pages together. Both should
look the same. No problem with IE and Opera but I cannot get this to
work with Mozilla.

If anyone would like to give me an hint, he can find an example here:

http://www.wiesodenn.de/problem/problem.html

dummy1 and dummydummy2 are form-buttons, dummy3 is the href-link.

The text for the buttons and the links is generated with php and that
is the reason why Ido not want to use images with grafic text as
buttons.

Does anyone know how to make this work with the main browsers?

All three buttons should have the same size and that small border half
way round...

(by the way, I cannot check this on a Mac, I f anyone would be so
nice..., thank you)

Thank you in advance for any answer..

Klaus

I don't understand why you use padding in the stylesheet. Use:

vertical-align:middle;
text-align:center

You have different padding values for links and buttons, and you have the
problem that padding is added to the content width in correct rendering, but
not in IE quirks mode.

Anyway if your targent audience is very small you could also ask them to
work with Javascript enabled and display the links as <button
onClick="...">.

HTH
Markus

"Markus Ernst" <singlewohnung (AT) gmx (DOT) ch> schrieb:

for a project I am currently working at, I have to use form-buttons
and normal links (a href...) in the same pages together. Both should
look the same. No problem with IE and Opera but I cannot get this to
work with Mozilla.

If anyone would like to give me an hint, he can find an example here:

http://www.wiesodenn.de/problem/problem.html

All three buttons should have the same size and that small border half
way round...

I don't understand why you use padding in the stylesheet. Use:

vertical-align:middle;
text-align:center

my problem is not the alignment of the text, it is the size of the
button. The picture under the text is 120px in width but in Mozilla it
is shown (much) smaller if the text is only a few characters.

Therefore I tried to use padding and margin to stretch the button to
the picture-size.

Anyway if your targent audience is very small you could also ask them to
work with Javascript enabled and display the links as <button
onClick="...">.

I do not like to use Javascript and more important, customer does not
want me to use Javascript.

Thanks
Klaus
--
Please reply only to usent, due to heavy (!) spamming
I am not checking this mail-account any longer.
Thank you.

"Klaus Schulz" <klsgfx (AT) yahoo (DOT) de> schrieb im Newsbeitrag
news:81v2ovsb1o9h5m3o7d42n2omp847dg72j2 (AT) 4ax (DOT) com...

"Markus Ernst" <singlewohnung (AT) gmx (DOT) ch> schrieb:

for a project I am currently working at, I have to use form-buttons
and normal links (a href...) in the same pages together. Both should
look the same. No problem with IE and Opera but I cannot get this to
work with Mozilla.

If anyone would like to give me an hint, he can find an example here:

http://www.wiesodenn.de/problem/problem.html

All three buttons should have the same size and that small border half
way round...

I don't understand why you use padding in the stylesheet. Use:

vertical-align:middle;
text-align:center

my problem is not the alignment of the text, it is the size of the
button. The picture under the text is 120px in width but in Mozilla it
is shown (much) smaller if the text is only a few characters.

Therefore I tried to use padding and margin to stretch the button to
the picture-size.

Anyway if your targent audience is very small you could also ask them to
work with Javascript enabled and display the links as <button
onClick="...">.

I do not like to use Javascript and more important, customer does not
want me to use Javascript.

Thanks
Klaus

Maybe it would be just a good idea to simplify. I don't see a reason for
parallel definitions of a general .button class and a special one for the
links. I am quite sure that the padding stuff can produce problems or
differences at least. BTW the correct notation for pseudo classes is AFAIK
a.button:hover and not a:hover.button.

--
Markus

On Tue, 7 Oct 2003 17:16:15 +0200, "Markus Ernst"
<singlewohnung (AT) gmx (DOT) ch> wrote:

my problem is not the alignment of the text, it is the size of the
button. The picture under the text is 120px in width but in Mozilla it
is shown (much) smaller if the text is only a few characters.

Maybe it would be just a good idea to simplify. I don't see a reason for
parallel definitions of a general .button class and a special one for the
links.

Hmm, seems I have to re-think the whole thing...

I am quite sure that the padding stuff can produce problems or
differences at least.

Yes, obviously. :-(

BTW the correct notation for pseudo classes is AFAIK
a.button:hover and not a:hover.button.

Oh, thanks. I will have a look at w3 to check.

Klaus
--
Punctuate this sentence: 'Woman without her man is nothing'.
Men wrote: 'Woman, without her man, is nothing.'
Women wrote: 'Woman! Without her, man is nothing.'