Meinung und Hilfe

[elo63]

Hallo,

habe eine css Datei geschrieben, und habe mal ein paar fragen bin eben noch Anfänger.

Warum sieht die Navigation Leiste/und der Text im main im Firefox etwas anders aus als in IE.

Warum muss ich in css navigation extra die breite angeben und im Header nicht.

Bemerkt Ihr noch Fehler in der css

mfg

elo


/* DIV umspannt alles */
#wrapper {
width: 780px;
background-color: white;
margin: 0 auto;
text-align: left; /* linksbündig */
}


/* DIV für Logo */
#header {
height: 80px; /* Höhe */
padding: 5px; /* Füllung */
background-color: gray;
}


/* Überschrift 1 in diesem Header */
#header h1 {
font-variant: small-caps; /* Kapitälchen */
color: white; /* in weiß */
}


/* DIV für Hauptbereich */
#main {
background-color: white;
padding: 40px;
margin: 0 0 0 0px;

}


/* Überschrift 1 im Hauptbereich */
#main h1 {
color: #1285DA;
}


/* DIV für Menübereich */
#navigation {
background-color: #70A9D8;
width: 780px;
height: 60px;
float: left;
}


#navigation li {
display: inline;
}


#navigation ul {
list-style-type: none;
}

 

[Mway]

AW: Meinung und Hilfe

Die Schrift sieht anders aus, weil du in der CSS keine Schrift definiert hast und somit die Standartschrift des Browsers genommen wird.

Die andere Frage mit dem Header hab ich noch nicht wirklich verstanden

 

[elo63]

AW: Meinung und Hilfe

Hallo
also die Seite sieht so aus
1 Header warum brauche ich hier keine Breite angeben, aber im Navi muss es sein.
2 780px Breite Navigationsleiste
3 Main mit Text diese Überschrift ist in den eine Browser näher an
der Navileiste als im anderen Browser. Und warum brauche ich hier
auch keine Breite angeben.
4 Habe im wrapper eine Breite angegeben 780px, geht auch nur im navi muss ich es nochmal extra angeben siehe 2.

danke

elo

 

[anoX]

AW: Meinung und Hilfe

Hast Du das irgendwo hochgeladen und kannst einen Link angeben?

Ich finde spontan dein "float" im Div der Navi überflüssig. Das macht nur im li Sinn, sofern Du eine horizontale Navi benutzt.

Dass Abstände anders sind liegt eben daran, dass Du vermutlich keine definiert hast und die Browser das unterschiedlich interpretieren.

 

[sokie]

AW: Meinung und Hilfe

wenn du die Liste auch mit float aus dem Dokumentfluss nimmst, braucht sie auch eine Breite, das ist normal (Die Frage ist allerdings, warum floaten, wenn sie sowieso die volle Breite des wrappers einnimmt?)
für die Überschiften hast du weder padding noch margin vergeben, die behandelt dann jeder Browser so, wie es seine Eingenart ist das zu tun. (eine einfache Lösung ist erstmal alle paddings und margins für alle Elemente auf 0 zu setzen, und dann Paddings und margins nur für die Elemente zu vergeben, die es brauchen - dann siehts auch in jedem Browser gleich aus)

* {
  padding: 0;
  margin: 0;
}

Voraussetzung ist auch valides html, und eine Doctype, die auch in allen Browsern zu standardkonformer Darstellung führt.

 

[Doitsu]

AW: Meinung und Hilfe

.. dass du in der Navi eine Breite mitgeben musst liegt am float.
ein div hat standardmaessig eine Breite von 100%. Sobald allerdings ein float ins Spiel kommt verfaellt das 100% und der divpasst sich an den inhalt an, deswegen sollte man auch immer in einem Float-Model Breite/Hoehen angaben machen, wenn man dies nicht mach muss man definitiv nach dem Float einen cleaner setzen.
Zum Abstand: koennte so sein wie mein Vorposter sagte, koennte aber auch an Fehlerhaften Markup (HTML-Kot) liegen. z.B. wenn du einen cleaner vergisst, koennte die ganze Seite nach oben rutschen.. Oder wenn der Inhalt vom #header groesser ist als 80 Pixel, dann sieben einige Browser den Rest nach unten, mache andere wieder nicht .. etc.

 

[elo63]

AW: Meinung und Hilfe

Hallo,

ja das ist doch das Problem, das ich eine Horizontale Navi möchte, mit vertikal kein Problem.

mfg

elo

 

[mela313]

AW: Meinung und Hilfe

Huhu,
nur noch ein minitipp um schreibarbeit bei größeren sachen zu sparen^^ wenn du zb. margin alle 4 werte auf 0 setzen willst, brauchst du die null nur 1 mal schreiben also "margin:0;". evtl. würd ich wenn du nen neues projekt anfängst im css erstmal alle werte auf null setzen also " * { margin:0; padding:0;} und den scrollbalken rechts einblenden weil ein layout das höher als der sichtbare bereich ist sonst beim einblenden des balkens springt. ich mache das mit "body { min-height: 101%;}