• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Länge in px eines Textes eines bestimmten Schrifttyp ermitteln

P

PHP Anfänger

Neues Mitglied
Hallo zusammen!

Ich versuche seit längerem eine Tabelle mit fixierte Kopfspalte hinzukriegen.
Doch für mein Projekt reichen diese Tipps, die nur bei manchen Browser klappen nicht.
Z .B. bei mir in Google Chrome funktioniert keine der Varianten.

Daher möchte ich nun zwei Tabellen machen, die eine mit den Spaltenüberschriften und die andere in einem div mit den Daten.

Da die Daten aber aus einer Datenbank kommen, können Sie verschiedene längen haben und ich muss die Spaltenbreiten der beiden Tabellen angleichen.

Dazu brauche ich irgendeine Tabelle oder Funktion, die mir sagt, welche länge in px oder pt ein Text in Arial 10 fett oder normal hat.

Gibt es so etwas, oder gibt es Tabellen wo die Länge für jedes Zeichen steht?

Vielen Dank für Eure Hilfe!
 
Und warum nimmst du nicht eine Tabelle und schreibst die Überschriften in die erste Zeile? Dann stehen sie doch automatisch über den Daten.
 
Weil ich keine Lösung finden konnte, mit der ich die Kopfzeile so fixieren kann, dass es in allen Browsern klappt, wie ich in meiner Frage geschrieben habe!
 
Und warum meinst du, dass du es dann mit den anderen Zeilen schaffst und diese exakt durch eine separat erstellte Kopfzeile stimmig überschreiben kannst. Ich denke, du solltest erst mal wissen, was du willst. In einer Tabelle weißt du nie so genau, wieviel Datensätze du bekommst und welche Länge die einzelnen Felder haben. Nun kann man die in einer Tabelle anzeigen und die Spalten fixieren und den Text abschneiden oder den Text in den Spalten umbrechen oder oder oder ... Es gibt sogar relativ komplexe Javascript Lösungen, wo der Benutzer dynamisch die Spaltenbreite (durch ziehen) einstellen kann. Eine weitere Möglichkeit wäre, in der Tabelle nur einen Teil der Daten anzuzeigen und der Benutzer kann einen Datensatz auswählen. Unter der Tabelle zeigst du dann alle Daten zum ausgewählten Datensatz in einem Formular schön formatiert und detailliert an.
 
Ich dachte mir, dass die 1. Tabelle über einem Scrollbereich steht, in dem die 2. Tabelle ist.
Dann sähe das ganze aus, wie eine fixierte Kopfzeile.
Wenn aber keiner eine Lösung für meine Frage weiß, muss ich wahrscheinlich eine feste Spaltenbreite vergeben.
 
ach das meinst du mit fixiert :-) ich dachte da sei etwas dachte mit den Spalten. Ja in deinem Fall musst das wohl wirklich trennen und die Überschrift in ein div legen mit position:absolute; dann musst du aber die dynamisch erstellten Spalten auch mit fester Breite erstellen, sonst steht die Überschrift irgendwo und passt nimmer zum Spalteninhalt. Die Frage ist, ob es echt Sinn macht, die Überschrift festzuhalten. Bei 100-200 Datensätzen ist man, sollte man wirklich vergessen haben, worum es sich handelt, schnell nach oben gescrollt. 1.000 oder mehr Datensätze machen kaum Sinn, die kann man mit den Augen kaum sinnvoll durchsuchen, dann sollte man die Query einschränken.
 
Ja, die Überschrift sollte schon dringend da bleiben.
Es sind zwar nur 50 Datensätze von 13000 die angezeigt werden, aber auch 30 Spalten, in denen Zahlen stehen, die man verwechseln kann.
 
Bei nur 50 Datensätzen würde ich mir keine Gedanken wegen der Überschrift machen und die, wenn es nicht absolut sein muss, einfach wegscrollen. Zur Not könntest die auch am Ende wiederholen.

Viel mehr Gedanken würde mir die hohe Anzahl der Spalten machen, falls das nicht fast nur Abkürzungen und Zahlen sind, musst ständig seitlich scrollen. Solltest nochmals über den Gedanken nachdenken, die Details in einem Formular anzuzeigen.

Dennoch hier mal ein Beispiel für eine feste Überschrift. Die komischen Farben hab ich nur, damit man sieht, wo die divs genau enden.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>das ist die Feste überschrift</title>
</head>
<body style="width:100%; height:100%; top:0; left:0; margin:0; padding:0; background-color:aqua;">
<div  style="background-color:black; width:100%;">
<div style="position:fixed; top:10px; margin:0; padding:0; height:20px; background-color:blue; color:white;">
 Hierher kommt die feste Überschrift</div>
<div style="background-color:yellow; margin-top:50px;">
<table>....</table>
</div>
</div>
</body>
</html>
 
Die Spalten sind hauptsächlich nur 3stellig, ich könnte die Überschriften ja quer stellen.
Für den Rest muss ich dann wohl festlegen, dass der Text umgebrochen wird.

Blöde, dass eine fixierte Kopfzeile in HTML/CSS nicht vernünftig zu machen ist.
Trotzdem vielen Dank!
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben