473,320 Members | 2,111 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

disguising links as buttons

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
Jul 20 '05 #1
17 4473
Klaus Schulz wrote:

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

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

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


They all look pretty much the same in my Mozilla 1.3, except that the
first button is a bit smaller than the others.
Matthias

Jul 20 '05 #2
Klaus Schulz wrote:
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.


Could you restructure the page such that dummy1 and dummy2 were not within
the form? If so you could then create little forms that just contained the
submit button:

<form action="dummy1" method="GET"><input type="submit"
value="dummy1"></form>
That will work in all browsers that support forms. The downside is that
search engines, etc will not be able to follow the links and the links will
not be rendered correctly as links in a non-visual browser.

--
Chris Lambert (http://web.trout-fish.org.uk/)
Celibacy is not hereditary.
Jul 20 '05 #3
Tim
On Fri, 26 Sep 2003 14:21:29 +0200,
Klaus Schulz <kl****@yahoo.de> wrote:
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.


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

--
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.
Jul 20 '05 #4
Hello Chris,

On Fri, 26 Sep 2003 16:00:25 +0100, Chris Lambert
<ne**@trout-fish.org.uk> wrote:
Could you restructure the page such that dummy1 and dummy2 were not within
the form? If so you could then create little forms that just contained the
submit button:

<form action="dummy1" method="GET"><input type="submit"
value="dummy1"></form>
Hmm, the whole application consits of a lot of pages. I think I could
do this on some of them, but on all? I have to try.
That will work in all browsers that support forms. The downside is that
search engines, etc will not be able to follow the links and the links will
not be rendered correctly as links in a non-visual browser.


This would be no problem, as the pages build an applictaion for a
customer in internet where only customer people will have account to
use the pages.

I will try to follow your advice.
Thank you.

Klaus
--
Mary Pickford
"Adding sound to movies would be like putting lipstick on the Venus de Milo."
Jul 20 '05 #5
Hello Matthias,

On Fri, 26 Sep 2003 15:12:42 +0200, Matthias Gutfeldt
<sa************@gmx.net> wrote:
http://www.wiesodenn.de/problem/problem.html
All three buttons should have the same size and that small border half
way round...


They all look pretty much the same in my Mozilla 1.3, except that the
first button is a bit smaller than the others.


Yes, that is the problem. The button is smaller and the drawn right
hand border is not visible. For a proper layout, all the buttons need
to appear the same size. If the link on the button would have less
characters, the button would be more small.

Klaus
--
Always remember you're unique, just like everyone else.
Jul 20 '05 #6
Klaus Schulz wrote:
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.


CSS is your friend. Consider styling for both links and buttons.

--
William Tasso - http://WilliamTasso.com
Jul 20 '05 #7
On Sat, 27 Sep 2003 01:24:09 +0930, Tim <ad***@sheerhell.lan> wrote:
Being deliberately deceptive is not in the interests of the user.


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.

Klaus
--
William Shakespeare, Hamlet
Tis brief, my lord. As a woman's love.
Jul 20 '05 #8
Hello,

On Sat, 27 Sep 2003 10:45:45 +0100, "William Tasso"
<ne****@tbdata.com> wrote:
CSS is your friend. Consider styling for both links and buttons.


Yes, I tried, as you can see in the example, but I was unable to make
them look like they should.

Perhaps you can hint me the right way...

Klaus

--
When asked if you believe in God, you ask, "Which one?"
Jul 20 '05 #9
Klaus Schulz wrote:
Hello,

On Sat, 27 Sep 2003 10:45:45 +0100, "William Tasso"
<ne****@tbdata.com> wrote:
CSS is your friend. Consider styling for both links and buttons.


Yes, I tried, as you can see in the example, but I was unable to make
them look like they should.

Perhaps you can hint me the right way...


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.

--
William Tasso - http://WilliamTasso.com
Jul 20 '05 #10
Tim
Tim <ad***@sheerhell.lan> wrote:
Being deliberately deceptive is not in the interests of the user.


Klaus Schulz <kl****@yahoo.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.
Jul 20 '05 #11
On Mon, 29 Sep 2003 00:07:35 +0930, Tim <ad***@sheerhell.lan> wrote:
Tim <ad***@sheerhell.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.
Jul 20 '05 #12
On Sat, 27 Sep 2003 23:46:55 +0100, "William Tasso"
<ne****@tbdata.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
Jul 20 '05 #13
Hello,

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

"William Tasso" <ne****@tbdata.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
Jul 20 '05 #14
"Klaus Schulz" <kl****@yahoo.de> schrieb im Newsbeitrag
news:tv********************************@4ax.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
Jul 20 '05 #15
"Markus Ernst" <si***********@gmx.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.
Jul 20 '05 #16
"Klaus Schulz" <kl****@yahoo.de> schrieb im Newsbeitrag
news:81********************************@4ax.com...
"Markus Ernst" <si***********@gmx.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
Jul 20 '05 #17
On Tue, 7 Oct 2003 17:16:15 +0200, "Markus Ernst"
<si***********@gmx.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.'
Jul 20 '05 #18

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: KS | last post by:
Im trying to prevent the user from clicking any other links on my page when the user have selected/clicked a href once. Sometimes it takes a while before the next page loads so some user will try...
7
by: Chris | last post by:
I'm using eight links listed horizontally as a menu on my site. I'm using font-variant:small-caps and they are padded so that they mimic buttons. My gripe is with the way IE handles the focus...
32
by: Mark Johnson | last post by:
You have an, a, anchor with href link. Can you use a stylesheet to effectively disable the link, so that you can't click on it; that it will appear simply as text?
14
by: Eli | last post by:
I'm fairly unfamiliar with CSS, but want to develop a way to skin a web application by using stylesheets for everything, including all images. I have a set of images used as buttons - mostly for...
0
by: Vladi | last post by:
Hello everybody, I have a asp.net 1.1 page which has the following controls: 4 Images whose src points to an image.aspx file which returns a different jpg from a DB 1 flash object on top of those...
1
by: Daniel Jung | last post by:
Hi I made a links list which looks like buttons. http://lingo.uib.no/v5/buttontest.html I'm stuck now. How do I get the black border right when the button is pressed? The thing is, buttons...
16
by: Frances | last post by:
<a href="#1"> <a name="#1"> this link is not working in FF (works fine in IE..) would appreciate thoughts/suggestions.. thank you.. Frances
3
by: Nico | last post by:
I have an idea but don't know if it's possible, from a technical point of view. Imagine to have some text. Example "John and Mary go to the cinema." I'd like to have this kind of links. By...
8
by: DJA | last post by:
Hello, I site I designed has links that don't seem to work in mac IE 5.2. In my site I'm using CSS to imitate image buttons by using the background image property along with a little extra...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.