webForumDet fria alternativet

Få översta raden i en tabell att inte scrolla?

HTML & CSSur HTML, XHTML & CSS

11 svar · 521 visningar · startad av maqe

maqeMedlem sedan dec. 2003824 inlägg
#1

Om man har jättemycket data i en tabell så att man måste scrolla i höjdled, kan man då få den översta raden "tr" att inte scrolla med resten av tabellen? Jag vill alltså att rubrikerna skall ligga överst hela tiden. Detta var något jag hittade men det verkar som att man måste sätta storlek på varje kolumn men jag vet inte hur många kollumner det blir då tabellen skall genereras dynamiskt.

silfverMedlem sedan apr. 200312 679 inlägg
#2

På den där sidan så ligger ju tabellen i en scrollbar div. Du kan väl göra likadant? Skriv rubriken utanför diven så kommer det ligga överst hela tiden. :)

maqeMedlem sedan dec. 2003824 inlägg
#3

Då stämmer inte rubriken med resten av innehållet i tabellen

silfverMedlem sedan apr. 200312 679 inlägg
#4

maqe skrev:

Då stämmer inte rubriken med resten av innehållet i tabellen

Jag tänkte lite fel. Såg lite fel. Varför tar du dig inte bara en titt i källkoden? :)

Så här hade jag gjort

<tabell med rubrik>
<div style="width: 100%; height: 300px; overflow: auto;">
	<tabell med celler>
</div>

Försöka att måtta in så det blir rätt borde väl inte vara så krångligt...

maqeMedlem sedan dec. 2003824 inlägg
#5

Det är ju just det som är problemet med att jag vill att det ska bli exakt rätt med rubriker och innehåll inte att jag ska gissa storlekar. Jag kommer ha flera tusen poster som kan vara 2 tecken eller 150 tecken

InsiderMedlem sedan jan. 2000978 inlägg
#6

Ett exempel: http://www.imaputz.com/cssStuff/bigFourVersion.html

hittade jag på http://www.456bereastreet.com/archive/200410/bring_on_the_tables/
som är bra att ha läst igenom.

maqeMedlem sedan dec. 2003824 inlägg
#7

Insider skrev:

Ett exempel: http://www.imaputz.com/cssStuff/bigFourVersion.html

hittade jag på http://www.456bereastreet.com/archive/200410/bring_on_the_tables/
som är bra att ha läst igenom.

Den översta länken var precis den jag posta i min fråga.

InsiderMedlem sedan jan. 2000978 inlägg
#8

OK, jag som var så nöjd när jag hittade den. :)

Jag testade att lägga in 9 kolumner i tabellen på imaputz.com utan att ändra nåt i CSS koden, och det såg faktiskt inte så tokigt ut. Kolumnrubrikerna stämde inte exakt, men det kanske går att pilla vidare.

maqeMedlem sedan dec. 2003824 inlägg
#9

hur får man overflow:hidden på en th?

maqeMedlem sedan dec. 2003824 inlägg
#10

Någon som har något tips på hur jag kan gå vidare med denna kod? Om man minskar fönstrets storlek så ballar ju allt ur samt att om jag har 50 kolumner så vill jag ju att översta raden skall scrolla med :) ... Känns som att detta är olösbart.

InsiderMedlem sedan jan. 2000978 inlägg
#11

Annars finns ju det beprövade knepet att skriva ut rubriker på var 10:e rad i tabellen. Men det är ju inte lika snyggt iofs.

maqeMedlem sedan dec. 2003824 inlägg
#12

jag tror jag hittat en lösning på en del av mitt problem. Såhär ser lösningen ut http://www.maqe.se/test2.htm dock skulle jag villja att första raden till vänster inte scrollade så det blir exakt som i excel :) Synpunker på lösningen? Detta kickar bara i IE men det gör mig inget då detta är till en EPiServer lösning

129 ms totalt · 3 externa anrop · v20260731065814-full.29ac60f6
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
126 ms — hämta tråd, inlägg och bilagor (db)