Identisches Aussehen für <a> und <button> per CSS

[Gunnar Bittersmann]

Hello out there!

Es geht darum, dass ein <a> Element genauso aussehen soll, wie ein entsprechendes <button> Element.

Du hast den Thread „Einen Button als Link verwenden“ im Archiv nicht gefunden?

Ziel ist es, dass zu den Formularbuttons auf meiner Seite ebenfalls Links definieren werden können, die genauso aussehen und sich genauso verhalten, wie der Button.

Geht nicht. Siehe meine Antwort in jenem Thread und beachte auch das nachfolgende Ingrid-Posting.

Für Blitzdenker, denen nun sofort ein <button type="button" onclick="...">Button</button> einfällt sei an dieser Stelle gleich gesagt: Das ganze muss ohne JavaScript laufen

Tut’s. Nur dass die Links dann im Aussehen mehr oder weniger stark von den Buttons abweichen.

Am Ende soll es möglich sein, drei Buttons nebeneinander darzustellen. Einen links, einen zentriert und einen rechts.

p {text-align: center}  
#foo {float: left}  
#bar {float: right}

angewandt auf <p><span id="foo">foo</span><span id="bar">bar</span><span id="baz">baz</span></p>

Ebenfalls soll man den Buttons wahlweise eine feste Breite mitgeben können.

Dann komt halt noch dazu:
span {display: block; margin: auto; width: 42px}

Wenn das alles zusammen realisiert wird, gibt´s ne Belohnung. :-)

Au fein, was gibt’s denn?

See ya up the road,
Gunnar