heinetz: Default Properies?

Beitrag lesen

Hallo @dedlfix,

irgendwie schaffe ich es hier selten, mich zu erklären ;( Aber ich probier's gerne nochmal 😉

Findest du, dass das ein sinnvolles Konstrukt ist?

Nein, es ist definitiv falsch, nicht valide und führt, wie gesagt zu einem Fehler, der nun auffällt.

Ist der Button letztlich nur ein Hilfskonstrukt, um dem Link das Aussehen eines Buttons zu geben?

Ich gehe sogar soweit, dass der Begriff "Button" zu einer falschen Abstraktion geführt hat. Es handelt sich um einen Text, der in einer eckigen Box steckt. Die Box hat eine Hintergrundfarbe und vielleicht einen Rahmen. Daher spricht der Designer von einem Button. Wenn man auf den Text klickt, gelangt man zu einer anderen Seite. Deshalb hat das technisch nichts mit einem Button zu tun, sondern ist einfach ein Textlink.

<div class="example_button"><a class="example_button_link" href="example.htm">Example</a></div>

Anscheinend.

Nun habe ich für meinen button.example_button natürlich nur CSS-Eigenschaften definiert, die notwendig waren, um die default-Werte eines <button>s zu überschreiben und ein <div> hat sicher andere default-Werte, die überschrieben werden müssten.

Also, wenn du dir die Frage stellst, welche Eigenschaften eines Elements überschrieben werden müssen, um sie wegzubekommen, dann wäre eher die Frage sinnvoll, warum man das tun möchte und ob es nicht ein besseres Element für den vorliegenden Anwendungsfall gibt.

Was genau ist für diesen Fall ein besseres Element? Ich möchte ja nur dem <button> seinen semantischen Sinn nehmen und an dem Konstrukt nichts ändern aus dem <button>. habe mit einem <div> ein Element gewählt, das meinem Verständnis ein reines Gestaltungselement ist. Ein <span> wäre vielleicht eine Alternative. Weil die Default-Eigenschaften eines <span> eher denen eines Button entsprechen und weniger überschrieben werden muss?

Aber mal konkret gefragt: Für welches Problem meinst du, brauchst du ein Container-Element für den Link? Lässt sich der Link nicht bereits so gestalten, wie du ihn haben möchtest?

Doch, theoretisch schon. Allerdings besteht das Konstrukt aus einem Eltern- und einem Kindelement. Die beiden haben ein Verhältnis zueinander ... margin, padding usw. Ich möchte mit wenigen Anpassungen valides Markup daraus machen. Ob das sinnvoll ist? Ja, in diesem Kontext schon, weil es relativ wenig Aufwand bedeutet.

Aber zurück zu meiner grundsätzlichen Frage:

Kann man jedes Element oder HTML-Tag gleich aussehen lassen indem man lediglich CSS-Eigenschaften anpasst? Mit den Chrome-Dev-Tools lassen sich ja sämtliche CSS-Eigenschaften einschliesslich der Default-Werte anzeigen. So bin ich schon darauf gekommen, dass mein div.example_button sich äusserlich von dem button.example_button unterscheidet, weil der <button> per default ein inline-block- und ein <div> per default ein block-Element ist. Wenn meine Annahme stimmt, müsste ich sämtliche Eigenschaften vergleichen und könnte so erreichen, was ich will. Sicher würde ich auch eine Menge lernen, aber das wäre mühselig. Interessant wäre daher, ob es etwas gibt, was mir diese Arbeit erleichtert.

gruss, heinetz