komm mit der navi nicht klar

[dallasstar]

Hallo erstmal,

ich bin am verzweifeln. es geht um die navi auf http://kruel.kr.funpic.de/index2.html (grün gekennzeichnet) ...

1) wie schaff ich es das die button gleich am rand anfangen, also ohne den rand rechts und links?

2) wieso ist im firefox zwischen header un navi nochmal ein abstand? dadurch wird das komplette design verschoben

3) ich muss für die listenpunkte eine feste breite angeben, und sie als block elemente festlegen weil sonst ist unter der navi nochmal ein kleiner, hasslicher abstand. es muss doch irgendwie gehn es auch ohne feste breiten zu schaffen weil es sonst überhaupt nicht gut ausschaut, da die buttons eigentlich unterschiedlich breit sind (sieht man ja)

Ich weiß schon sind schon wieder ziemlich viel fragen, wäre aber sehr dankbar wenn es sich jemand anschaun könnte

[dallasstar]

hier mal alles was für die navi relevant ist:

div.navi {
	height: 15px;
         width: 966px;
}


ul.menue {
	list-style-type: none
}


ul.menue li{
	float: left;
         text-align: center;
         height: 15px;
         width: 100px;
}


ul.menue li a{
	display: block;
	width: 100%;
}

[hero-master]

1) wie schaff ich es das die button gleich am rand anfangen, also ohne den rand rechts und links?

Pack mal zu Beginn das hier in die CSS-Datei:

* {margin:0; padding:0}

Außerdem hast du bei den Listenpunkten ein text-align:center; definiert. Warum sollten sie dann also links und rechts keinen Abstand haben?

2) wieso ist im firefox zwischen header un navi nochmal ein abstand? dadurch wird das komplette design verschoben

Hat sich durch den Code oben dann erledigt, Stichwort: vordefinierte Abstände der Browser

3) ich muss für die listenpunkte eine feste breite angeben, und sie als block elemente festlegen weil sonst ist unter der navi nochmal ein kleiner, hasslicher abstand. es muss doch irgendwie gehn es auch ohne feste breiten zu schaffen weil es sonst überhaupt nicht gut ausschaut, da die buttons eigentlich unterschiedlich breit sind (sieht man ja)

Wenn du floatest, musst du auch eine Breite definieren. Du könntest den LIs eine ID zuweisen und dann die Breite für jeden Listenpunkt extra definieren
Oder du packst das display:block; aus der Definiton für die Menupunkte raus (ist ja nicht unbedingt notwendig) und gibst den LIs ein display:inline

[dallasstar]

ich liebe dich

danke, 1 & 2 wäre jetzt geklart (obwohl ich mich frag was an * anders ist wie an body... ), durch das * {margin:0; padding:0} werden aber auch die leerezeilen bei <p></p> entfernt, aber damit kann ich leben. dann hau ich halt <br>'s rein

hab jetzt

ul.menue li a{
display: block;
width: 100%;
}

ganz rausgemacht und dafür bei den LI's display: inline, aber dann sind (natürlich nur im IE) unter den LI's wieder so kleine hässliche abstände...
http://kruel.kr.funpic.de/index2.html

[hero-master]

(obwohl ich mich frag was an * anders ist wie an body... )

margin und padding werden bekanntermaßen nicht weitervererbt
Somit gilt diese Definiton nur für den body-Tag.
Eine Objekte haben vordefinierte Außen- und Innenabstände, die vn Browser zu Browser anders sein können.
Das * {} bringt alle Außen- und Innenabstände auf 0

durch das * {margin:0; padding:0} werden aber auch die leerezeilen bei <p></p> entfernt, aber damit kann ich leben. dann hau ich halt <br>'s rein

Finger weg
Gib dem P-Tag einfach wieder einen Abstand p {margin......}

aber dann sind (natürlich nur im IE) unter den LI's wieder so kleine hässliche abstände...
http://kruel.kr.funpic.de/index2.html

Evtl. hilft ein font-size:1px; oder/und ein line-height:1px;

[dallasstar]

weißt du wie viel der standard abstand bei <p>'s ist? Is ja bei IE und Firefox ziemlich gleich wie ich des seh...

Ah danke line height hat geholfen, ok dann mach ich jetzt mal weiter. und wenn ich wieder fragen habe meld ich mich wieder

vielen dank bis hier hin!

[hero-master]

weißt du wie viel der standard abstand bei <p>'s ist? Is ja bei IE und Firefox ziemlich gleich wie ich des seh...

Kannst ja rumprobieren, muss ja auch nicht zu 100% mit dem Vordefinierten übereinstimmen Definier das so, dass es gut aussieht