Ganane: Padding in Abhängigkeit der Anzahl der Zeichen in einem Element

Hi Selfler!

Ich habe zwar wenig Hoffnungen, aber kann ich irgendwie Elemente, in denen X Buchstaben sind, anders formatieren als Elemente in denen Y Buchstaben sind - ohne ihnen eine andere Klasse zuzuweisen? Ich stelle mir das so vor:

  
a[zeichenlänge=5] { background: red; }  
a[zeichenlänge=10] { background: blue; }  

Somit sollte '<a href="#">Hallo</a>' einen roten Hintergrund bekommen und '<a href="#">Hallo Welt</a>' einen Blauen. Geht das irgendwie?

Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein. Daher gebe ich einem Button mit einem zeichen ein größeres Padding als einem Button mit 2 Zeichen usw.. Da diese Buttons aber oft geändert werden, möchte ich mir Aufwand ersparen und ihnen nicht immer manuell eine eigene Klasse geben.

Ich freu' mich auf eure Hilfe ;)

Gruß,
Ganane

  1. Hi,

    kann ich irgendwie Elemente, in denen X Buchstaben sind, anders formatieren als Elemente in denen Y Buchstaben sind - ohne ihnen eine andere Klasse zuzuweisen?

    Nein.

    Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein. Daher gebe ich einem Button mit einem zeichen ein größeres Padding als einem Button mit 2 Zeichen usw..

    Warum definierst Du nicht einfach width? Ggfls. mit display:block oder float?

    freundliche Grüße
    Ingo

    1. Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein. Daher gebe ich einem Button mit einem zeichen ein größeres Padding als einem Button mit 2 Zeichen usw..
      Warum definierst Du nicht einfach width? Ggfls. mit display:block oder float?

      Ich kenne ja nicht die größte Größe.

      Es kann sein, dass es einen Button mit einem Zeichen und einen Button mit zwei Zeichen gibt. Dann sollte der Button mit einem Zeichen so groß sein, wie der Button mit zwei Zeichen. Es kann aber auch einen Button mit 5 Zeichen und einen Button mit zwei Zeichen geben. D.H. die maximal Größe ändert sich, je nachdem wieviele Zeichen der Button mit den meisten Zeichen beeinhaltet.

      1. Hi,

        Warum definierst Du nicht einfach width? Ggfls. mit display:block oder float?

        Ich kenne ja nicht die größte Größe.

        Es kann sein, dass es einen Button mit einem Zeichen und einen Button mit zwei Zeichen gibt. Dann sollte der Button mit einem Zeichen so groß sein, wie der Button mit zwei Zeichen. Es kann aber auch einen Button mit 5 Zeichen und einen Button mit zwei Zeichen geben.

        D.h. doch, wie viel Padding es jeweils brauchen wuerde, um die Maximalbreite zu erreichen, weisst du genauso wenig.

        D.H. die maximal Größe ändert sich, je nachdem wieviele Zeichen der Button mit den meisten Zeichen beeinhaltet.

        Dann ermittle die Maximalbreite (oder maximale Buchstabenanzahl) per Script - client- oder serverseitig.

        MfG ChrisB

      2. Hi,

        Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein. Daher gebe ich einem Button mit einem zeichen ein größeres Padding als einem Button mit 2 Zeichen usw..
        Warum definierst Du nicht einfach width? Ggfls. mit display:block oder float?

        Ich kenne ja nicht die größte Größe.

        Du kannst sie aber ermitteln!
        Da Du monotype verwendest, hat jedes Zeichen die gleiche Breite. Wenn nun maximal 4 Zeichen vorkommen, dann probiere einige em-Werte, bis es passt.

        Es kann aber auch einen Button mit 5 Zeichen

        gerade hast Du 4 als Maximum angegeben... wenn es 5 sind, dann ermittle halt die Breite für 5 Zeichen.

        freundliche Grüße
        Ingo

  2. Ich habe zwar wenig Hoffnungen, aber kann ich irgendwie Elemente, in denen X Buchstaben sind, anders formatieren als Elemente in denen Y Buchstaben sind

    Nein.

    Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein.

    Was hast du gegen (min-)width:6em o.ä.?

    1. Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein.

      Was hast du gegen (min-)width:6em o.ä.?

      Ich nichts, aber die <IE7 schon. Für aktuelle Browser, ist das natürlich die beste Lösung.

      1. Hintergrund ist folgender: ich habe mehrere Buttons mit der Schriftart Monospace. In diesem Buttons können immer 1-4 Zeichen stehen, aber alle Buttons sollen gleich groß sein.

        Was hast du gegen (min-)width:6em o.ä.?

        Ich nichts, aber die <IE7 schon. Für aktuelle Browser, ist das natürlich die beste Lösung.

        Mit width können auch die alten IEs leidlich umgehen und wenn du dem IE6-Schwund mit freundlichen Hinweisen noch etwas Nachdruck verleihst, wirst du dir um dessen Fehler auch nicht allzu viel Gedanken machen müssen.

        Nichtsdestotrotz, wenn du natürlich, wie in der anderen Antwort angedeutet, überhaupt nicht weißt, wie breit die letztlich Felder sein sollen, werden dir weder width, min-width noch padding helfen.