Zum Inhalt springen

CSS: Text soll immer X px breit sein


pc-nico

Empfohlene Beiträge

Hallo Leute,

bevor ich lange erkläre schaut euch mal bitte die linke Navigation auf www.Only.com an...

Die ist in Flash... ich möchte gern so eine Navigation mit CSS+HTML erstellen...

Vom Prinzip her muss man ja nur definieren das jeder Absatz x PX breit sein soll

und die Schrift entsprechend skaliert werden soll... aber geht das mit CSS?

Man könnte natürlich jedem Absatz eine eigene Schriftgröße geben, aber

vllt geht es ja auch einfacher...

Ich möchte quasi das eine Liste immer die selbe breite hat und die Buchstaben

skaliert werden....

BSP:

Home

Nachrichten

Bilder

....

soll so aussehen:

Home

Nachrichten

Bilder

vllt kann jemand helfen.....

Link zu diesem Kommentar
Auf anderen Seiten teilen

Spontan würd ich das per Javascript lösen. Einfach die Navi per JS basteln und wenn du bspw. jedes zweite Element in der Navi größer haben willst, schaust du einfach mittels einer Schleife ob der Zähler innerhalb deiner Schleife ungrade oder grade ist und je nach dem setzt du Schrift eben größer/kleiner.

Bin mir nur nicht sicher ob der "Aufwand" sinnvoll ist, aber das darfst du entscheiden ;)

Greetz

Link zu diesem Kommentar
Auf anderen Seiten teilen

Danke für die Idee... leider löst das nicht mein Problem...

weil jede Zeile eine andere Größe haben wird....

Wie gesagt, der Text soll egal wieviele Buchstaben er hat immer eine Breite von

x Pixel haben...

Es ist also nicht ein einfach wechsel zwischen groß/klein/groß/klein

Link zu diesem Kommentar
Auf anderen Seiten teilen

Ja du kannst sicherlich jedem Navigationspunkt eine andere Größe geben, aber ich würde das wie auch auf only.com mit Flash oder mit Bildern Realisieren, der aufwand das so pixel genau anzupassen wäre mir zu groß.

Gespannt bin ich auch ob du das für alle Browser einheitlich hinbekommst, wenn deine Seite mal nen Stand hat, den man sich anschauen kann würde ich mich über nen Link freuen.

Grüße

Link zu diesem Kommentar
Auf anderen Seiten teilen

Also ob es nun in jedem Browser gleich aus sieht, ist mir gar nicht so wichtig...

Hauptsache die gängigen Browser zeigen es ordentlich und einigermaßen so wie

ich es gern möchte an.... So langsam kann man auch keine Rücksicht mehr auf

den alten Internet Explorer 5 oder 6 nehmen... Zumal ich mich mit meinen

Seiten an XHTML und CSS Standard halte, der IE6 im Gegensatz ignoriert ja

gern so manchen Standard... Deshalb wird auf der Seite bei Verwendung von IE 6

oder älter auch ein entsprechende Update hinweis angezeigt.

So lange Vorrede, hier nun das Ergebnis: http://msv90-handball.de

.

Link zu diesem Kommentar
Auf anderen Seiten teilen

der IE6 ist nicht mehr relevant. Ihn weiter zu unterstützen würde nur dazu führen das die User nie wechseln / updaten müssten was auch eine Sicherheitsfrage ist. Da kann man ja gleich win 3.11 oder uralte CMS-Systeme unterstützen.

nico, ich kann auf der Webseite nichts mit dem Effekt erkennen... ?

Link zu diesem Kommentar
Auf anderen Seiten teilen

der IE6 ist nicht mehr relevant. Ihn weiter zu unterstützen würde nur dazu führen das die User nie wechseln / updaten müssten was auch eine Sicherheitsfrage ist. Da kann man ja gleich win 3.11 oder uralte CMS-Systeme unterstützen.

nico, ich kann auf der Webseite nichts mit dem Effekt erkennen... ?

Genau so denke ich auch... und prinzipiell kann man die Seite mit dem IE 6 nutzen, nur kommt es halt zu kleineren Darstellungsfehler die aber die Nutzbarkeit,

nicht einschränken....

Was meinst du mit Effekt? Den Hinweis für IE 6 User?

Link zu diesem Kommentar
Auf anderen Seiten teilen

aso, sorry.... Wenn du im Bereich "Über uns", "1. Herren" etc bist, wird links ein

Untermenü eingeblendet, wo der Text immer (fast) die gleiche Breite hat...

Jeder Zeile hat dabei eine eigene font-size angabe... Steht mit in der Datenbank

wo die Menü-Einträge gespeichert sind...

(Hab die nötigen Werte sehr einfach ermittelt... erstmal in der Datenbank eine

Wert von 24 bei allen Einträgen eingefügt... Dann Seite im Browser anzeigen lassen

und mit der Web-Deverloper Symbolleiste für Firefox den Quellcode "Live"

bearbeitet... So kann man leicht spielen ohne immer im Code/DB arbeiten zu

müssen... Am Ende dann die ermittelten Werte fest in der DB gespeichert)

Link zu diesem Kommentar
Auf anderen Seiten teilen

Also erstmal zum IE6, leider stimmt das das er noch der 3. meiste genutze Browser ist. Daher kann man ihn nicht ganz vernachlässigen.

Bei kleineren Seiten würde ich ihn auch vernachlässigen, aber bei sehr großen Communities oder Online Shops würde ich mit der vernachlässigung noch ein wenig warten.

Und nun eine andere Frage, warum schreibst du die Schriftgröße fest in die Datenbank? Warum machst du dir nicht ein paar verschiedene CSS Klassen?

Grüße

Link zu diesem Kommentar
Auf anderen Seiten teilen

Weil der Aufwand für Klassen fast genau so groß gewesen wäre.... Gibt nur

wenige Elemente die die gleiche Schriftgröße haben.... somit hätte ich fast so

Klassen gebraucht, wie Elemente in der DB sind... Sonst versuche ich auch alles

über Klassen zu lösen und keine INLINE Styles zu verwenden. Aber hier war das

nicht so praktikabel....

Link zu diesem Kommentar
Auf anderen Seiten teilen

Ja aber wenn du CSS Klassen verwendest ist das ganze um einiges flexibler und zudem ist es sicherlich auch performanter weil du dir die Datenbank abfragen sparen kannst.

Und wenn jemand mal das Projekt weiter entwickeln/pflegen soll, und genau an dieser Stelle was ändern muss wird er sich sicherlich bedanken weil er nie vermuten wird das das CSS aus der Datenbank kommt.

Also ich würde dir wirklich raten das in deine CSS Datei zu schreiben!

Grüße

Link zu diesem Kommentar
Auf anderen Seiten teilen

Also ne Datenbankabfrage kann ich dort nicht fragen, da ich das Menü eh aus der

Datenbank abfrage... Ich könnte mir höchsten ein Attribute bei der Abfrage sparen.

Vllt versteht du jetzt den Hintergrund... Selbst mit Klassen müsste ich diese

in der Datenbank erfassen... Weil das Menü gibt es nirgends.... Nur eine Funktion

in PHP die es erstellt....

Man erkennt sehr deutlich im Code das der font-size Wert aus der Datenbank

kommt...

(Wenn es dich interessiert, kann ich dir ja die PHP Datei mal schicken... )

Link zu diesem Kommentar
Auf anderen Seiten teilen

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...