Goran: Links in einer Zeile auf besondere Weise ausrichten

Hallo Forum,

ich möchte eine Zeile mit Links/Ankern besetzen. An sich kein Problem.

Nur möchte ich die Abstände zwischen Links so haben das

1. die Abstände so groß sind das der erste Link am Anfang bzw. der letzte Link am Ende der Zeile steht;

2. beim hinzufügen bzw. wegnehmen von Links das ganze wieder angepasst wird, so das Punkt 1. wieder gilt.

Ein Beispiel:

Zeile/Container mit 1 Anker:
+-----------------------------+
|Link0                        |
+-----------------------------+

Zeile/Container mit 2 Anker:
+-----------------------------+
|Link0                   Link2|
+-----------------------------+

Zeile/Container mit 3 Ankern:
+-----------------------------+
|Link0       Link1       Link2|
+-----------------------------+

Zeile/Container mit 4 Ankern:
+-----------------------------+
|Link0   Link1   Link2   Link3|
+-----------------------------+

Zeile/Container mit 5 Ankern:
+-----------------------------+
|Link0 Link1 Link2 Link3 Link4|
+-----------------------------+

Kann mir jemand weiterhelfen?

Beste Grüße

Goran

  1. Hallo

    ich möchte eine Zeile mit Links/Ankern besetzen. An sich kein Problem. Nur möchte ich die Abstände zwischen Links so haben das

    1. die Abstände so groß sind das der erste Link am Anfang bzw. der letzte Link am Ende der Zeile steht;

    2. beim hinzufügen bzw. wegnehmen von Links das ganze wieder angepasst wird, so das Punkt 1. wieder gilt.

    Ein Beispiel:

    Zeile/Container mit 1 Anker:
    +-----------------------------+
    |Link0                        |
    +-----------------------------+

    Zeile/Container mit 2 Anker:
    +-----------------------------+
    |Link0                   Link2|
    +-----------------------------+

    Zeile/Container mit 3 Ankern:
    +-----------------------------+
    |Link0       Link1       Link2|
    +-----------------------------+

    Zeile/Container mit 4 Ankern:
    +-----------------------------+
    |Link0   Link1   Link2   Link3|
    +-----------------------------+

    Zeile/Container mit 5 Ankern:
    +-----------------------------+
    |Link0 Link1 Link2 Link3 Link4|
    +-----------------------------+

    Kann mir jemand weiterhelfen?

    Als erstes die Frage: Hast du dir Gedanken für den Fall gemacht, dass da mehr Links sind, als in die Zeile passen?

    Bei Listamatic findest du viele Beispiele, wie man Linklisten, darum handelt es sich technisch, sowohl vertical als auch horizontal, in einer oder mehreren Ebenen (verschachtelt) stylen kann. Das ist einerseits eine Fundgrube und andererseits das Stöbern in diesem Angebot eine Lehrstunde.

    Tschö, Auge

    --
    Die Musik drückt aus, was nicht gesagt werden kann und worüber es unmöglich ist zu schweigen.
    (Victor Hugo)
    Veranstaltungsdatenbank Vdb 0.2
    1. Hallo

      ich möchte eine Zeile mit Links/Ankern besetzen. An sich kein Problem. Nur möchte ich die Abstände zwischen Links so haben das

      1. die Abstände so groß sind das der erste Link am Anfang bzw. der letzte Link am Ende der Zeile steht;

      2. beim hinzufügen bzw. wegnehmen von Links das ganze wieder angepasst wird, so das Punkt 1. wieder gilt.

      ...

      Als erstes die Frage: Hast du dir Gedanken für den Fall gemacht, dass da mehr Links sind, als in die Zeile passen?

      Bei Listamatic findest du viele Beispiele, wie man Linklisten, darum handelt es sich technisch, sowohl vertical als auch horizontal, in einer oder mehreren Ebenen (verschachtelt) stylen kann. Das ist einerseits eine Fundgrube und andererseits das Stöbern in diesem Angebot eine Lehrstunde.

      Tschö, Auge

      Klar hab' ich mir gedanken gemacht... ist aber kein Prob. da ich immer im voraus weiß welche bzw. wieviele Links in der Zeile stehen...

      Ein ähnliches Menü hab' ich auf der von dir verlinkten Seite gefunden...

      http://dizque.lacalabaza.net/temp/full-width-navigation-bar-with-css.html

      Nur der erste und der letzte Link passen mir noch nicht. Ich kann zwar den Text links und rechts positionieren aber damit ändert sich nicht der Abstand zur zweiten bzw. zur vorletzten Zelle.

      Noch jemand dzbgl. paar Tipps?

      Beste Grüße,

      Goran

      1. Hallo

        Klar hab' ich mir gedanken gemacht... ist aber kein Prob. da ich immer im voraus weiß welche bzw. wieviele Links in der Zeile stehen...

        Du weißt auch, wie breit das browserfenster ist, sprich, wieviele Links in eine Zeile passen?

        Ein ähnliches Menü hab' ich auf der von dir verlinkten Seite gefunden...

        http://dizque.lacalabaza.net/temp/full-width-navigation-bar-with-css.html

        Ein Link ist dort mindestens so breit, wie das längste Wort des Linktextes. Ansonsten funktioniert es in modernen Browsern und benötigt für IEs Extraangaben, die bei _jeder_Änderung_ der Anzahl der Links angepasst werden müssen (namentlich width:...;).

        Nur der erste und der letzte Link passen mir noch nicht. Ich kann zwar den Text links und rechts positionieren aber damit ändert sich nicht der Abstand zur zweiten bzw. zur vorletzten Zelle.

        Die Breite der Tabellenzelle verhält sich proportional zur Länge des in ihr notierten Textes. Ein kurzer Text bedeutet nicht nur einfach eine schmale Zelle, auch der Abstand zwischen erstem bzw. letztem Zeichen und dem Rand ist gering. Bei Zellen mit langem Text ist auch der Abstand zwischen erstem/letztem Zeichen und dem Rand der Zelle größer. Damit wird auch die Zelle überproportional breiter.

        So gesehen in FF2 mit den CSS-Angaben, die auf der oben verlinkten Seite benutzt werden..

        Tschö, Auge

        --
        Die Musik drückt aus, was nicht gesagt werden kann und worüber es unmöglich ist zu schweigen.
        (Victor Hugo)
        Veranstaltungsdatenbank Vdb 0.2
  2. Ich hab leider immer noch keine Lösung gefunden. Wenn jemand auch nur vage Tipps hat bitte her damit ;-)

    Goran

    ...

    Ein Beispiel:

    Zeile/Container mit 1 Anker:
    +-----------------------------+
    |Link0                        |
    +-----------------------------+

    Zeile/Container mit 2 Anker:
    +-----------------------------+
    |Link0                   Link2|
    +-----------------------------+

    Zeile/Container mit 3 Ankern:
    +-----------------------------+
    |Link0       Link1       Link2|
    +-----------------------------+

    ...

    1. Yerf!

      Ich hab leider immer noch keine Lösung gefunden. Wenn jemand auch nur vage Tipps hat bitte her damit ;-)

      Ich hatte mal ein ähnliches Anliegen, nur mit Buttons. Im prinzip gibts 2 Ansätze, die aber beide nicht optimal sind. Entweder man nimmt eine Tabelle oder man trickst mit Blocksatz (text-align:justify) rum.

      Die Blocksatzvariante ordnet wunderbar so an, wie du es haben willst, allerdings musst du eine 2. Zeile erzwingen, da die letzte Zeile eines Absatzes von der Blocksatzformatierung ausgenommen wird. Und da wirds dann unschön: du musst hinter den letzten Link mit einem Whitespace getrennt eine Menge von   Anhängen, damit diese auf jeden Fall in eine neue Zeile Umbrechen. Wenn diese neue Zeile optisch stört musst du sie mit entsprechenden Größenangaben und overflow:hidden diese verstecken...

      Gruß,

      Harlequin

      --
      <!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
      1. Yerf!

        ...

        Ich hatte mal ein ähnliches Anliegen, nur mit Buttons. Im prinzip gibts 2 Ansätze, die aber beide nicht optimal sind. Entweder man nimmt eine Tabelle oder man trickst mit Blocksatz (text-align:justify) rum.

        ...

        »»

        So, habe ich mal probiert. Wirklich unschön. Ganz zufrieden bin ich nicht aber zur Not...

        Was nicht heissen soll das ich für weitere Vorschläge offen bin ;-)

        Gruß,

        Harlequin

        Beste Grüße

        Goran

        1. Was nicht heissen soll das ich für weitere Vorschläge offen bin ;-)

          Ja, dann ...

          Best wishes, imho_tep

          --
          Es geht aufwärts, sagte der Fisch, als er an der Angel hing.