Text im Menü zweizeilig erscheinen lassen

[Khan cross]

Hallo Leute,

ich versuch die ganze Zeit per CSS eine horizontale Menüleiste so zu gestalten, dass der enthaltene Text, also die Menüpunkte, zweizeilig erscheinen.

So ungefaehr soll es aussehen

HOME     |     OUR SERVICES     |      CONTACT
START    |  UNSERE LEISTUNGEN   |      KONTAKT

Dieses Beispiel hat also 3 Buttons.

Welche Möglichkeiten gibt es um das zu verwirklichen?

Danke für die Anregungen
Grüsse
KC

[Matthias Apsel]

Om nah hoo pez nyeetz, Khan cross!

Welche Möglichkeiten gibt es um das zu verwirklichen?

display: inline-block; in Verbindung mit einer Breitenangabe für die li-Elemente.

Matthias

[Gunnar Bittersmann]

@@Khan cross:

nuqneH

So ungefaehr soll es aussehen

HOME     |     OUR SERVICES     |      CONTACT
START    |  UNSERE LEISTUNGEN   |      KONTAKT

Eigentlich sollte es das nicht. Warum das UI vollmüllen und den Nutzer mit mehrsprachigen Beschriftungen nerven und er muss sich seine Sprache selbst raussuchen?

Liefere Webseiten (bzw. Teile davon) einsprachig aud – in der vom Nuter gewünschten Sprache.

Qapla'

[Matthias Apsel]

Om nah hoo pez nyeetz, Gunnar Bittersmann!

HOME     |     OUR SERVICES     |      CONTACT
START    |  UNSERE LEISTUNGEN   |      KONTAKT

Eigentlich sollte es das nicht. Warum das UI vollmüllen und den Nutzer mit mehrsprachigen Beschriftungen nerven und er muss sich seine Sprache selbst raussuchen?

Siehste. Wieder nicht ordentlich gelesen. Ist mir garnicht aufgefallen, dass es nur drei Knöpfe sein sollen. Asche. Asche. Asche.

Matthias

[Khan cross]

Ja es sollen nur 3 Knöpfe sein. Die Webseite ansich hat nur sehr wenig Text, so dass es noch akzeptabel bleibt 3 Sprachen zu machen. Es gibt ja auch nicht mehr als 3 Buttons im Menü.

Hat jemand einen Tip auf Lager das zu verwirklichen?

[Matthias Apsel]

Om nah hoo pez nyeetz, Khan cross!

Wenn du es denn wirklich trotz Gunnars Hinweis so machen möchtest, nimm einfach <br>.

Matthias

[Gunnar Bittersmann]

@@Matthias Apsel:

nuqneH

Wenn du es denn wirklich trotz Gunnars Hinweis so machen möchtest, nimm einfach <br>.

Warum das? Die verschiedensprachigen Breschriftungren sollten sowieso in verschiedenen Elementen Stecken – mit jeweils eigenem @lang-Attribut.

<nav id="main-nav">  
  <ul>  
    <li>  
      <a href="/">  
        <span lang="en">Home</span>  
        <span lang="de">Start</span>  
      </a>  
    </li>  
    ⋮  
  </ul>  
</nav>

#main-nav span  
{  
  display: block;  
  text-transform: uppercase;  
}

Ja, auch die Großschreibung gehört ins Stylesheet, nicht ins Markup – dort sollte „Home“ stehen, nicht „HOME“.

Qapla'