This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm whether you accept or reject these cookies being set.

A cookie will be stored in your browser regardless of choice to prevent you being asked this question again. You will be able to change your cookie settings at any time using the link in the footer.

Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
ueberschrift Tabelle
#1
Hallo,

hier meine Tabelle : https://oesoft.de

die Spalten der Überschrift (position:fixed
) bedecken die erste Zeile der Tabelle Confused 

 <div class="container_table">
	 
   <h5 class="ueberschrift_table"> TABELLE | OHNE FILTER </h5>

   <div class="container_scroll" id="table">
    <table>
     <thead>
      <tr>
	  <th class="zustaendigkeit"></th>
	  <th class="schnittstelle"></th>
      <th class="uhrzeit">UHRZEIT</th>
      <th class="kennung">KENNUNG</th>
      <th class="sub"></th>
      <th>TAKTISCHE EINHEIT</th>
	  <th>STANDORT</th>
	  <th></th>
	  <th></th>
	  <th></th>
	  <th></th>
     </tr>
    </thead>
     <tbody class="display_table" id="jstable_test">
	
    </tbody>
   </table>
  </div> 
  </div>
 th { 
     border: 1px solid Gray;
     background-color: #F2F2F2;
     font-family: system-ui;
     font-weight: 100;
     padding: 5px;
 }
 
 td { 
     border: 1px solid Gray;
     text-align: left;
	 padding: 3px;
 }
 
 thead {
     color: gray;
	 position:fixed;
	 margin-top: 0px;
 }
 
 .display_table {
     display: block;
 }
Zitieren
#2
Wieso position: fixes??? Wieso?

Du solltest deine Tabelle nicht mit 'position: fixed;' austatten. Verwende 'p' anstatt den 'font'-Tag. Du solltest nicht der Tabelle die CSS-Eigenschaft 'overflow', sondern dem Elternelement '[font=Consolas, "Courier New", monospace]jstable_test[/font]'. Verwende keinen width-Attribut in den td-Tags. Gebe der Tabelle eine feste Größe. Am besten gebe dem Elternelement die CSS-Eigenschaft 'overflowConfusedcroll' und gebe den Elternelement eine feste Größe. Die Größe der Tabelle solltest du auf 100%.


Viele Grüße

rzscout
black79 likes this post
"Gerne dürft ihr mir eine gute Bewertung da lassen aber auch gegenüber Kritik bin ich offen" Angel
Als Lösung markieren Zitieren
#3
(14.01.2023, 21:21)rzscout schrieb: Wieso position: fixes??? Wieso?

Du solltest deine Tabelle nicht mit 'position: fixed;' austatten. Verwende 'p' anstatt den 'font'-Tag. Du solltest nicht der Tabelle die CSS-Eigenschaft 'overflow', sondern dem Elternelement '[font=Consolas, "Courier New", monospace]jstable_test[/font]'. Verwende keinen width-Attribut in den td-Tags. Gebe der Tabelle eine feste Größe. Am besten gebe dem Elternelement die CSS-Eigenschaft 'overflowConfusedcroll' und gebe den Elternelement eine feste Größe. Die Größe der Tabelle solltest du auf 100%.


Viele Grüße

rzscout


 Guten Morgen,

 also ich soll einiges über JavaScript DOM Elemente regeln bzw. CSS über Typselektoren.
 Wenn ich Dich richtig verstanden habe.

"position: fixed" kommt raus !

  Rolleyes  Danke
Als Lösung markieren Zitieren
#4
Folgendes: Ich würde auch empfehlen eine Pagination einzuühren. Keiner liest sich alle Werte durch, da würde eine Pagination weiter helfen. Du solltest auch dich an den HTML5-Standard halten wenn du diesen oben so deklariert hast. Also keine font-Tags in HTML mehr. Verwende auch nicht in den td-Tags das Attribut width - hier solltest du mit CSS arbeiten. Es ist wichtig so gut wie möglich HTML von CSS zu trennen. Das gillt auch für JavaScript. Hier sollte man ein Inline-Skript verwenden.
"Gerne dürft ihr mir eine gute Bewertung da lassen aber auch gegenüber Kritik bin ich offen" Angel
Als Lösung markieren Zitieren
#5
(15.01.2023, 13:57)rzscout schrieb: Folgendes: Ich würde auch empfehlen eine Pagination einzuühren. Keiner liest sich alle Werte durch, da würde eine Pagination weiter helfen. Du solltest auch dich an den HTML5-Standard halten wenn du diesen oben so deklariert hast. Also keine font-Tags in HTML mehr. Verwende auch nicht in den td-Tags das Attribut width - hier solltest du mit CSS arbeiten. Es ist wichtig so gut wie möglich HTML von CSS zu trennen. Das gillt auch für JavaScript. Hier sollte man ein Inline-Skript verwenden.


Ok, werde hier noch einiges nachlesen müssen Wink  aber das ist der Lerneffekt.
Pagination "ist schon nicht ohne!" für einen Anfänger oder?

Versuche mich jetzt erstmal von Boostrap zu trennen, und dementsprechend alles mit CSS umzusetzen.
Werde Deine Vorschläge bzw. Deine Hilfe versuchen nach und nach umzusetzen.

Danke für Deine Hilfe
Als Lösung markieren Zitieren
#6
Aller Anfang ist schwer, wenn man viel mit jQuery und Bootstrap gearbeitet hat muss sich umorientieren, aber dafür hast die volle Kontrolle über deine Elemente und kannst selber festlegen wie die Inhalte via CSS gestaltet werden.

Ich habe in der Vergangenheit viel mit Bootstrap gearbeitet. Ich war nie der größte Fan, aber man konnte einiges damit erreichen. Heutzutage ist das alles überflüssig und zu 100% durch reines CSS austauschbar. Du brauchst nicht mehr dich an Bootstrap orientieren sondern kannst dich auf die Standards von HTML5 und CSS3 konzentrieren. Damit sparst du auch Traffic und Performance.

VG
rzscout
"Gerne dürft ihr mir eine gute Bewertung da lassen aber auch gegenüber Kritik bin ich offen" Angel
Als Lösung markieren Zitieren
#7
(15.01.2023, 17:35)black79 schrieb: Ok, werde hier noch einiges nachlesen müssen Wink  aber das ist der Lerneffekt.
Pagination "ist schon nicht ohne!" für einen Anfänger oder?



Das mit der Pagination hatten wir ja schon mal
https://basti1012.bplaced.net/index.php?ordner=javascriptforum&id=793

So schwer ist es eigentlich nicht und besser als immer alle Daten zu holen , gerade bei Tabellen mit mehreren hunderten Einträgen.

Hier hatte ich mal Beis
black79 likes this post
Hier sind alle meine Lösungen aus allen Foren. Ich helfe auch in Facebook-chat
Als Lösung markieren Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste