Diverse Fragen mittelschwerer Art...

[Phil Marx]

Nabend ihr Self'ler,

Ich benötige mal wieder eure Hilfe... Ich friemel ja seit Tagen an einem neuen Design und das soll komplett mit CSS realisiert werden. Dabei stellen sich aber einige Probleme:

1.) Ich habe mein Menü mit Listen (<ul>, <li>) realisiert und nebeneinander bzw. untereinander angeordnet. Nun machen aber zwei Browser in verschiedener Art Probleme:
Ich habe den Listenelementen die Eigenschaft list-style: none zugewiesen, dennoch rückt der IE die Elemente ein. Besonders beim Hovern der oberen, waagerechten Navigation stört das immens. Ist es möglich, diese Einrückung irgendwie zu unterdrücken?

2.) In der Nebennavigation links habe ich die Überschriften mit <h4> erstellt und formatiert. Der Firefox macht dort leider einen Absatz, wie bei einem Blockelement (was <h4> ja auch ist)... Wie kann ich diesen Blockabsatz unterdrücken? Mit display:inline geht die Breite der Überschrift nur soweit, wie der Text vorgibt, auch wenn width:100% (oder auto) angegeben wird.

3.) Ist es möglich, die Nebennavigations-Box so hoch zu machen wie der Content ist? Also wie der Content unten am Fuß der Seite mit der Fußleiste abschließt? Wenn ja, wie?

Das soll es (erstmal) gewesen sein, danke für eure Hilfe jetzt schon :)

Falls ihr das Problem euch genauer anschauen müsst, so schaut mal auf http://yubb.homeip.net/versuch/test.html vorbei :)

[ichen]

Moin!» Nabend ihr Self'ler,

Ich benötige mal wieder eure Hilfe... Ich friemel ja seit Tagen an einem neuen Design und das soll komplett mit CSS realisiert werden. Dabei stellen sich aber einige Probleme:

1.)

http://de.selfhtml.org/css/eigenschaften/listen.htm#list_style_position

3.) Ist es möglich, die Nebennavigations-Box so hoch zu machen wie der Content ist? Also wie der Content unten am Fuß der Seite mit der Fußleiste abschließt? Wenn ja, wie?

baue einen div um beide (text undnavi) und gebe bei navi height:100%; an, dann ist der immer so griß wi der Content den umschließenden div großzieht.
tschüss
ichen

[Phil Marx]

Hi!

http://de.selfhtml.org/css/eigenschaften/listen.htm#list_style_position

Janee, nun haben wir das Problem in der linken Navigation gelöst, da liegen die Elemente direkt an (im IE). Nur in der NAvigation oben sind beim Hover immer noch links auffällige Lücken.

baue einen div um beide (text undnavi) und gebe bei navi height:100%; an, dann ist der immer so griß wi der Content den umschließenden div großzieht.

Probiert, aber das funktioniert weder im IE noch im Firefox...

[ichen]

Moin!

Nur in der NAvigation oben sind beim Hover immer noch links auffällige Lücken.

das liegt daran, dass der IE keine :hover pseudoklasse für elemente versteht, die nicht <a> sind.
da müsste ich selber etwas experimentieren... Auf die schnelle geht das nicht :-(

zu xtranavi:
da habe ich leider auch keine schnelle lösung.
sorry ichen

[ichen]

Moin!
ich habe die lösung für dein prob mit der Navigation oben. hab dir das CSS-File mal per mail geschickt, weil ich nicht son riesen posting absetzen will.
ichen

[ichen]

Moin!
der schönheitsfehler: die der ganz linke link ist nun ganz am rand.
ästhetische lösung:
ergänze in css datei die classe navi:

.navi {
margin: 3px 10% 0px 10%;
width:auto;
text-align:center;
background-color: #506A8F;
}

tschüss ichen

[ichen]

Moin!
zu 2.)
in alles Browsern, wo ich es getestet habe (IE 6, Opera 7.23, NS7.1, Moz 1.4), wird das hintergrundbild auf voller breite angezeigt. da es sich jedoch um eine gepunktete border handelt, könnte man das auch mit CSS machen:
border:dotted 1px farbe;
tschüss ichen

[Phil Marx]

Moin? *gg*

da es sich jedoch um eine gepunktete border handelt, könnte man das auch mit CSS machen:
border:dotted 1px farbe;

Nee, leider nicht, da ist ein Pixel Punkt und zwei Pixel frei... Das bekomm ich in CSS net hin. Bei border 1px ist ein Pixel Punkt und nur ein Pixel frei. Und das sieht dann blöde aus :-/

[Jan Balgemann]

1.)
ul {
    list-style-type:none;
    margin:0px;
    padding:0px;
}
Damit sollten alle Einrückungen entfernt sein. Bei deinem CSS fehlt meine ich zumindest das padding.

2.)
div.xtranavi h4 {
    margin:0px;
    width:100%;
}
3.)
Ginge meines Wissens nach nur über eine feste Höhe. Also du müsstest dann auch den Contentbereich auf ne feste Höhe festlegen. Ist ja auch eigentlich kein Problem, dann machst da halt ein overflow:auto; rein und man kann drin scrollen.
Faken könntest du es natürlich einfacher. Du hast ja diesen div (<div style="margin:0px;">), der Navi und Content umschließt. Mach den mit nem weißen bg und verpass dem content-div einen rand links, der genauso ist, wie der rechte vom Menü sein sollte. Und das Menü kriegt rechts dafür keinen Rand.

[Detlef G.]

Hallo Phil Marx

1.) ...

Versuche mal Folgendes:
Lege selbst für ul _und_ li _alle_ margin und padding fest.
Die Browser steuern das Aussehen der Listen unterschiedlich, teils über margin, teils über padding, teils bei ul, teils bei li.
Dadurch ergeben sich unterschiedliche Anzeigen, wenn man nicht alles selbst bestimmt.

2.) ...

Lege selbst margin-top, margin-bottom sowie padding-top und padding-bottom fest. Die Browser haben in ihrem Default-CSS unterschiedliche Werte.
Eventuell auch noch line-height anpassen.

3.)  ...

Bei veränderlicher Contenthöhe nicht wirklich. Bei entsprechendem Seitenaufbau könnte man es allerdings dafür sorgen, dass es so aussieht, als wäre diese genauso hoch.

http://yubb.homeip.net/versuch/test.html vorbei :)

Rufe die Seite mal im Mozilla auf und vergrößere die Schrift.
Schau, wie dann deine Pünkchenlinien wirken.

Auf Wiederlesen
Detlef

[Efchen]

Moin,

2.) Wie kann ich diesen Blockabsatz unterdrücken?

Du meinst vermutlich "margin"? Da ist ein Abstand oben und einer unten, die musst Du weg machen.

3.) Ist es möglich, die Nebennavigations-Box so hoch zu machen wie der Content ist?

Nein. Ich hatte letztes mal ne schöne Seite dazu gehabt. Da wurden einige Workarounds angeboten. Aber das eine hatte dieses Problem, das nächste das Problem, und jede Lösung ließ sich nicht uneingeschränkt einsetzen. Das ist ein Punkt, mit dem Tabellen besser zurecht kommen. Aber deswegen würde ich keine Tabelle einsetzen, sondern lieber die Navigation so lassen, wie sie ist.

Gruß,
-Efchen