zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden ::: kleine starthilfe :::

Antwort
 
LinkBack Themen-Optionen Ansicht
  #11 (permalink)  
Alt 15.12.2006, 20:20
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von benzrecordings Beitrag anzeigen
was würdest du machen.?
Die Inhalte mit einem div-Element zusammenfassen und dort das Hintergrundbild reinlegen.
Wie du es auf 100%-Höhe bringst, steht in den FAQ.


Zitat:
zudem bekomm ich immer noch nicht die schrift in der navi richtig hin !
Was soll mit der Schrift sein?
Mit Zitat antworten
Sponsored Links
  #12 (permalink)  
Alt 15.12.2006, 21:00
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.09.2006
Beiträge: 60
benzrecordings befindet sich auf einem aufstrebenden Ast
Standard

danke erstmal, dass du mir so hilfst! der trick mit dem div war sehr gut, allerdings ist der hintergrund ganz oben ein bisschen verschoben, und mit der schrift meine ich, dass die in der navi viel kleiner und unleserlicher ist als z.b.: rechts in der sidenavi obwohl die die gleiche eigenschaft haben....

hier mein aktueller stand: Unbenanntes Dokument
Mit Zitat antworten
Sponsored Links
  #13 (permalink)  
Alt 15.12.2006, 21:10
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von benzrecordings Beitrag anzeigen
ist der hintergrund ganz oben ein bisschen verschoben,
Gib nur dem body den Hintergrund, nicht nochmal dem html.
Und lies bitte, was in den FAQ zum CSS-Prolog steht.
Auch body und html können Default-Ränder haben.

Zitat:
und mit der schrift meine ich, dass die in der navi viel kleiner und unleserlicher ist als z.b.: rechts in der sidenavi obwohl die die gleiche eigenschaft haben....
Du verwendest small-caps. Kleinbuchstaben sind somit kleiner als Großbuchstaben.
Vermutlich suchst du text-transform:uppercase.
Mit Zitat antworten
  #14 (permalink)  
Alt 15.12.2006, 22:31
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.09.2006
Beiträge: 60
benzrecordings befindet sich auf einem aufstrebenden Ast
Standard

oh man, perfekt! jetzt funktionierts einwandfrei. werde mich jetzt nochmal intensiver in das thema einarbeiten und versuchen möglichst sauber zu formatieren und so viel wie möglich aus zu lagern. aber so hab ich schonmal ein guten startpunkt...

jupiii!
Mit Zitat antworten
  #15 (permalink)  
Alt 16.12.2006, 16:16
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.09.2006
Beiträge: 60
benzrecordings befindet sich auf einem aufstrebenden Ast
Standard

ich bins schon wieder

und zwar steh ich nun vor dem problem, das der abstand zwischen den einzelnen navigationspunkten in den browsern variiert.

zur erklärung, ich hab die navigation in einer liste. diese liegt in einem div "navi" im hintergrund ist eine grafik mit trennstrichen. ich hab dann den abstand zwischen den einzelnen listenpunkten mit margin-right definiert.

Code:
#navigation li {
	list-style: none;
	display: inline;
	margin-right: 2.1em;
}
dann hab ich alles schön ausgerichtet und auf meinem powerbook, mit OS X passen die menupunkte in jedem browser optimal zwischen die optischen trenner. auf einem anderen Rechner mit windows XP sind die in jedem browser verschoben, also der abstand zwischen den links ist größer! allerdings auch in jedem browser identisch! Wie kann es sein, dass auf dem mac im firefox alles passt und auf dem windows rechner nicht. hab auch verschiedene auflösungen ausprobiert, aber daran liegts nicht. ich denke, dass der befehl margin-right verschieden interpretiert wird.

was kann ich machen, dass der abstand identisch ist auf jedem system und in jedem browser? gibts ne alternative zu margin right? hab ach schon versucht anstatt ems pixel zu nehmen, hilft aber auch nicht...

vielleicht weiß jemand von euch rat...

hier der link: Unbenanntes Dokument


gruß chris

Geändert von benzrecordings (16.12.2006 um 16:22 Uhr)
Mit Zitat antworten
  #16 (permalink)  
Alt 16.12.2006, 16:25
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Texte lassen sich nicht in Pixelmaße pressen. Die tatsächliche Textgröße ist von vielen Faktoren abhängig, die du nicht beeinflussen kannst (z.B. Schriftvergrößerung im Browser, OS etc. [1]).
Wenn du Kontrolle über die Breite der horizontalen Menüpunkte haben willst, dann brauchst du float in Verbindung mit Breitenangaben. Das wird aber immer zum Überfließen bei Schriftvergrößerung führen.

[1] Gerade kleine Schriften laufen aufgrund der unterschiedlichen Kantenglättung unter Mac und Win oft unterschiedlich breit.

Geändert von fricca (16.12.2006 um 16:28 Uhr)
Mit Zitat antworten
  #17 (permalink)  
Alt 16.12.2006, 16:31
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.856
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Deine Konstruktion ist absolut nicht skalierbar.

Lasse li floaten (individuelle Breite in em per ID) und gib ihnen die Grafik (nicht die ganze, sondern nur einen Ausschnitt mit 3 Strichen) als Hintergrund. Lasse auch ul floaten, damit es li einschließt und seine Höhe anpaßt, wenn die Links bei Textvergrößerung umbrechen.

EDIT: zu langsam
Mit Zitat antworten
  #18 (permalink)  
Alt 16.12.2006, 16:41
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.09.2006
Beiträge: 60
benzrecordings befindet sich auf einem aufstrebenden Ast
Standard

hi, danke für die antworten, hab schonmal versucht die schrift 1px größer zu machen und schon siehts besser aus.

@heiko, kannst du das für einen anfänger verständlich erklären?

also lasse ich sowohl #navigation li als auchg #navigation ul mit float: left; floaten?

wie kann ich mit id arbeiten? kann ich dann jedem menupunkt eine einzelne breite geben?

mit der grafik hakts bei mir auch, wenn ich jetzt nur die drei striche nehme und in den hintergrund jeweils lege, dann sind die ja genau mittig dahinter, oder kann ich die auch verschieben?

oh man so kompliziert
Mit Zitat antworten
  #19 (permalink)  
Alt 16.12.2006, 16:45
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Das beste für einen Anfänger ist, sich Grundlagen anzueignen.
Das geht am besten mit einem Buch (Suchfunktion!).

In diesem Forum können spezielle Probleme zu Einzelfällen geklärt werden. Eine Schritt-für-Schritt-Anleitung ist etwas viel verlangt.
Ein Online-Einstieg findet sich bei css4you. Dort kannst du auch die CSS-Eigenschaften nachschlagen (z.B. was mit Hintergrundbildern möglich ist!)
Tutorials zum Umgang mit Listenmenüs gibt's bei maxdesign.
Mit Zitat antworten
Sponsored Links
  #20 (permalink)  
Alt 16.12.2006, 16:54
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.856
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von benzrecordings Beitrag anzeigen
also lasse ich sowohl #navigation li als auch #navigation ul mit float: left; floaten?
Genau. Alle brauchen dabei eine width-Angabe. Da Du mit fester px-Breite arbeitest, bekommt ul width in px, li dagegen in em, da der Platz für eine px-Breite zu knapp ist (denn mindestens 2 FX-Textvergrößerungen sollten immer möglich sein). Unterm Strich ist der Effekt dabei derselbe wie per Deiner derzeitigen Lösung per display: inline;, aber Du hast mehr Kontrolle über die einheitliche Darstellung in den verschiedenen Browsern.

Zitat:
Zitat von benzrecordings Beitrag anzeigen
wie kann ich mit id arbeiten?
Genau wie Du es bereits bei den divs tust, z.B. <li id="news">
Übrigens: Wirf das div #navigation raus und gib ul diese ID.

Zitat:
Zitat von benzrecordings Beitrag anzeigen
kann ich dann jedem menupunkt eine einzelne breite geben?
Code:
#news {
width: 4em;
}
Zitat:
Zitat von benzrecordings Beitrag anzeigen
in den hintergrund jeweils lege, dann sind die ja genau mittig dahinter, oder kann ich die auch verschieben?
Klar, per background-position.

Zitat:
Zitat von benzrecordings Beitrag anzeigen
oh man so kompliziert
Ne, ist gar nicht sooo kompliziert
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Welches CMS für kleine bis mittelgroße Projekte emti Offtopic 22 14.01.2010 16:58
IE6 kleine Lücke rechts in Kopf und Fuss hubspe CSS 3 01.12.2007 11:12
Zwei kleine Styleprobleme rigo CSS 2 01.09.2007 23:40
Extra Stylesheet für kleine Bildschirme (ohne Javascript) beginners CSS 9 03.01.2006 15:34
Kleine ungereimheiten im IE Deedoo CSS 8 20.12.2005 23:52


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:08 Uhr.