[css:design] text-left und text right in einem Container?

[_julius]

Hey Leute,

ich hab eine Frage. Ich will ein Menü,dass sich in einem Container befindet namens "Menü". Hierdrin möchte ich, dass 4 Elemente des Menüs rechts und 1 Element rechts ist. Die 4 für rechts habe ich mit "text-align:right;" rechts angeordnet. Wenn ich jetzt aber den ganz linken button den ich links anbinden will über "text-align:left;" nach links katapultieren will (gebe jedem button einen eigenen .tag) verschwinden die 4 Buttons rechts in der nächsten Zeile. Geht sowas überhaupt? 2 verschiedene text-aligns in einem Container? Gibt es Alternativen? Außer links daneben eine neue Zelle aufzumachen.

Machts gut

Julius

 

[xlqr]

dazu nimmst du am besten den span tag, ungefähr so:

<div><span class="links">xxxx</span><span class="rechts">xxx</span></div>

und dann *links* und *rechts* per css floaten.

.links {float: left}

…
http://css.maxdesign.com.au/floatutorial/introduction.htm

 

[m-schmidt]

hmm, also ich wird mal sagen du musst in dienem Containter 2 neue Untercontainer aufnehmen, über die du dann die Ausrichtung regelst. Anders kann ich mir das jetzt nicht vorstellen ...

EDIT: @xlqr: Ja, so meinte ich das auch. Da warst du schneller

 

[msslovi0]

Ich will ein Menü,dass sich in einem Container befindet namens "Menü". Hierdrin möchte ich, dass 4 Elemente des Menüs rechts und 1 Element rechts ist.

Aber nicht wegen des Fippthelers. Wie soll das denn aussehen? So?

<style type="text/css">
  * {
    margin: 0;
    padding: 0;
  }
  
  ul {
    width: 200px;  
    list-style: none;
  }
  
  li {
    border: 1px solid red;
    text-align: right;
  }
  
  .textLeft {
    text-align: left;
  }
</style>

<ul>
  <li class="textLeft">Men&uuml;punkt 1</li>
  <li>Men&uuml;punkt 2</li>
  <li>Men&uuml;punkt 3</li>
  <li>Men&uuml;punkt 4</li>
  <li>Men&uuml;punkt 5</li>  
</ul>

(gebe jedem button einen eigenen .tag)

Tut das Not? Oder blähst du nur den Quelltext auf?

verschwinden die 4 Buttons rechts in der nächsten Zeile. Geht sowas überhaupt? 2 verschiedene text-aligns in einem Container? Gibt es Alternativen? Außer links daneben eine neue Zelle aufzumachen.

Gib mal Code. Irgendwie will mir das mit dem einen Container in Zusammenhang mit einem Menü (=Kombination aus ul/li-Tags) nicht so recht klar werden...

Matt

 

[msslovi0]

dazu nimmst du am besten den span tag, ungefähr so:

<div><span class="links">xxxx</span><span class="rechts">xxx</span></div>

und dann *links* und *rechts* per css floaten.

.links {float: left}

…

Ich habs heut offensichtlich nicht so ganz mit dem Durchblick. Das floatet doch per se, da span kein Blocklevelelement ist. Mit dem rechts ausrichten wird es daher auch schwierig, außer man bügelt per css wieder ein 'display: block' drüber.

Und wie ein Menü sieht das auch nicht aus, tendiert eher Richtung undefinierbares Etwas.

Matt

 

[_julius]

danke hat geklappt.

womit ich bei der nächsten frage wäre folgende. meine seite wird jetzt im firefox genau richtig angezeigt nur leider im IE nicht. ich kann es mir ungefähr denken weil firefox sehr großzügig ist was das vergessen von diversen tags angeht und manche dinge "einfach durchgehen lässt".

problem: die eben besprochene menüleiste wird in firefox korrekt dargestellt dennoch in IE zeigt er unter dieser leiste (innerhalb der zelle noch) 3 pixel freie zeilen an.

warum?

 

[_julius]

hier die seite angehängt

 

[moses_78]

problem: die eben besprochene menüleiste wird in firefox korrekt dargestellt dennoch in IE zeigt er unter dieser leiste (innerhalb der zelle noch) 3 pixel freie zeilen an.

warum?

Stichwort "3px float-bug". Siehe http://www.positioniseverything.net/explorer/threepxtest.html

 

[_julius]

und jetzt auf deutsch? ich scheine es nicht ganz zu verstehen...

 

[_julius]

so ich hab anhand dessen versucht dran herumzufummeln aber es tut sich leider nichts! wieso zum teufel macht der das? ich habe ihm doch eine absolute höhe von 19px gegeben! IE STINKT!

 

[Difool]

hi _julius,

schau mal hier rein: Browserkompatibilitäten (Internet Explorer & Co)

Gruß Difool

 

[_julius]

ich finde nur leider in den links nirgendwo die lösung für mein genanntes problem

(das mit den 3pixeln)