display:inline-block; ^^ frage

[hokage555]

hi leute ;-)

ich bins mal wieder
ich hab mich jetzt entschieden meine horizontale navi mit display:inline-block zu realisieren. denn hätte ich float benutzt, dann gäbe es später komplikationen beim anpassen des inhaltes an den viewport, da der rahmen des contents sich mit der navi irgendwann bei entsprechender verkleinerung überlappen würde. außerdem hätte das clearen in bezug auf die linke vertikale navi probleme gemacht, da diese leiste zu lang ist, so dass der content viel zu tief erst begonnen hätte ;-). daher jetzt das wunderwerk inline-block

allerdings kann ich mir keinen reim auf die abstände zwischen den links machen, wo ich doch jedes margin auf 0 gesetzt habe. ist das eine besondere eigenart von dieser eigenschaft?

ich bekomme sie mit negativen marginwerten weg, aber ist das nicht eher eine lösung, die das eig. problem umgeht?
liegen die abstände vll. an irgendetwas anderem, weil normal dürften sie ja nicht da sein ;-)

in wie weit funktioniert display:inline-block eig. im ie 7? habe nur den 8ter

hier der seitenlink:

Startseite

danke für eure hilfe ;-)

grüße hokage

ps: kennt einer einen guten ie7 emulator, oder eine screenshot website, wo ich sehen kann wie meine page in den verschiedenen alten ie angezeigt wird?

 

[prm]

Der Abstand resultiert wohl aus der Eigenschaft "inline-block" und ist ähnlich dem zwischen zwei Wörtern. Geht also mit margin und padding "0" nicht weg.

Nun habe ich versucht, die li's zu floaten, was kein Problem ist.
Allerdings muss dann danach gecleart werden, so dass sich der #content unter der Horizontalnavi anordnet. Und genau da liegt das Problem:
Das Clearen bewirkt nämlich, dass der #content nach unten wandert, und zwar auf Höhe des Endes der Vertikal-Navi. Grund: diese ist auch gefloatet und an deren Ende beginnt der clear.

Grundsätzlich könntest du die Seite umstellen und #seite rechts floaten. Dann könnte man auch die links gefloateten li's clearen.
Allerdings bräuchte hierzu #seite eine fixe Breite und das ist bei dir nicht vorgesehen.
Somit fällt mir für deine Konstruktion keine Lösung ein.
Oder du kannst mit den Abständen leben.

Die Alternative wäre ein fixes Layout, oder du gibst dem linken und rechten Teil je eine prozentuale Breite.

Weitere Möglichkeit:
Du setzt den Header mit Horizontalnavi quer über die gesamte Breite, also auch über die Vertikalnavi.
Dann sollte es keine Probleme geben, wenn du links die Vertikalnavi hast und rechts davon den Inhalt.

 

[hokage555]

genau diese floatproblematik habe ich ja auch schon festgestellt, aber ich habe mich jetzt entschieden diese abstände beizubehalten.
lasse es also bei inline-block;
das sieht so ach ganz gut aus
und zur not hacke ich mir die abstände halt mit negativen margins weg
geht schneller als alles umzubauen ;-)

aber danke für deine tips xD

grüße hokage

ps: nein das layout soll schon variabel sein ;-) fixe layouts sind zu einfach möchte das ganze jetzt so mal probieren ;-)
passt schon xD

 

[neuroleptika]

ps: kennt einer einen guten ie7 emulator,?

IE8:
Extras > Entwicklertools > Browsermodus > Internet Explorer 7.

Für IE 5-7 kann man mit einer Mischung aus display: inline und haslayout ein inline-block-Verhalten bewirken.
Das Problem ist eher der FF2 er kennt kein display: inline-block.
Ein Hack wäre sehr Kompliziert.

 

[FoXMorayn]

kleine frage am rande: hat der IE8 auch einen IE6 modus?

 

[neuroleptika]

Leider nicht

 

[hokage555]

danke dir neuroleptika ;-)
das war mir bis dato noch nicht bekannt