Søg
Avatar billede rossoneris Nybegynder
24. juli 2008 - 13:34 Der er 18 kommentarer og
1 løsning

Html og scroll

Jeg sidder og roder med noget som jeg ikke rigtig ved om kan lade sig gøre.
Jeg har en tabel i et html dokument med 3 kolonner. Jeg ønsker en scroll bar når indholdet er for langt til at være på en skærm. Og det kan jo laves sådan her

<div style="height:100px;overflow:auto;" id="listnotice">
<TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0">
    <TR>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colLeft">leftest</TD>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colNormal">normaltest</TD>
        <TD WIDTH="20%" HEIGHT="100%" VALIGN="top" ID="colRight">right</TD>
    </TR>
</TABLE>
</div>

Problemet er, at hvis indholdet er for langt i den ene kolonne og man scroller ned, så scroller de øvrige kolonner også ned, hvor jeg ønsker at de ikke skal røre sig.

Nogen der har en ide?
Avatar billede Slettet bruger
24. juli 2008 - 13:43 #1
Det er jo klart, du har jo sat dit overflow på div'en helt uden om. Hvis du vil have at de forskellige søjler skal blive, så må du i stedet sætte din overflow på TD'erne
Avatar billede rossoneris Nybegynder
24. juli 2008 - 13:45 #2
hmm .. det har jeg også forsøgt, men så går der helt kage i den, men har på fornemmelsen jeg måske sætter den forkert ind - kan du give et eksempel ?
Avatar billede Slettet bruger
24. juli 2008 - 13:53 #3
<TD style="vertical-align:top;width:40%;height:15em;overflow:auto" ID="colLeft">leftest</TD>

burde virke (dog utestet)
Avatar billede w13 Novice
24. juli 2008 - 14:01 #4
daleif>> vertical-align fungerer ikke som valign, så den skal nok beholdes.
Avatar billede rossoneris Nybegynder
24. juli 2008 - 14:04 #5
hmm - jeg har prøvet følgende nu

<TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0">
    <TR>
        <TD style="vertical-align:top;width:40%;height:15em;overflow:auto" ID="colLeft">leftest</TD>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colNormal">normaltest</TD>
        <TD WIDTH="20%" HEIGHT="100%" VALIGN="top" ID="colRight">right</TD>
          <p><br>
          <br>
        </TD>
    </TR>
</TABLE>

Men kan godt nok fortsat ikke få det til at funke .... :( - har da rodet lidt i html, men det her virker godt nok lidt kryptisk for mig
Avatar billede w13 Novice
24. juli 2008 - 14:19 #6
<p><br>
          <br>
        </TD>
hører da vist ikke hjemme der?
Avatar billede w13 Novice
24. juli 2008 - 14:20 #7
Sådan her: (testet)

<TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0">
    <TR>
        <TD style="vertical-align:top;width:40px;height:15em" ID="colLeft"><div style="height:100%;overflow:auto">leftest</div></TD>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colNormal">normaltest</TD>
        <TD WIDTH="20%" HEIGHT="100%" VALIGN="top" ID="colRight">right</TD>
    </TR>
</TABLE>
Avatar billede rossoneris Nybegynder
24. juli 2008 - 14:21 #8
Korrekt - men har jeg lige fjernet, men stadig samme problem :(

<TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0">
    <TR>
        <TD style="vertical-align:top;width:40%;height:15em;overflow:auto" ID="colLeft">leftest</TD>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colNormal">normaltest</TD>
        <TD WIDTH="20%" HEIGHT="100%" VALIGN="top" ID="colRight">right</TD>
       
    </TR>
</TABLE>
Avatar billede w13 Novice
24. juli 2008 - 14:23 #9
Min sidste virker.
Avatar billede Slettet bruger
24. juli 2008 - 14:23 #10
ja, man bliver vist nødt til at have en div inden i TDen, kan vist ikke sætte overflow på en TD.

w13>> hvad er forskellen på valign og vertical-align?
Avatar billede rossoneris Nybegynder
24. juli 2008 - 14:24 #11
Tusind tak - det havde jeg sku aldrig gennemskuet
Avatar billede w13 Novice
24. juli 2008 - 14:25 #12
Vertical-align justerer elementer i forhold til den linje, de er på.
Valign justerer i forhold til det omkransende element.

http://www.w3schools.com/Css/pr_pos_vertical-align.asp
Avatar billede w13 Novice
24. juli 2008 - 14:25 #13
Tak for point! ;)
Avatar billede olebole Juniormester
24. juli 2008 - 14:40 #14
<ole>

w13 >> skån os for w3schools.com og hans oceaner af fejl, mangler og misforståelser, please!  ;o)

Vertical-align justerer elementer i forhold til den linje, de er på. Undtagelsen for denne regel er td-elementer, hvor vertical-align justerer indholdet - helt ligesom valign  ;o)

/mvh
</bole>
Avatar billede olebole Juniormester
24. juli 2008 - 14:42 #15
"Vertical-align justerer elementer i forhold til den linje, de er på" er egentlig ikke helt præcist. Måske jeg ville foretrække denne formulering:
"vertical-align justerer elementet i forhold til de andre elementer i elementets parent element"
Avatar billede rossoneris Nybegynder
24. juli 2008 - 14:51 #16
Så lige et tillægs spørgsmål - ID="colLeft", skal jeg have ind i Div style, da "colLeft" er et felt hvor teksten bliver hentet ned i - og nu står den jo ikke rigtig. Hvordan får jeg sat den korrekt over - bare at flytte den fungerer ikke, som jeg har prøvet forneden

<TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0">
    <TR>
        <TD style="vertical-align:top;width:40px;height:15em"><div style="height:100%;overflow:auto;ID="colLeft"">leftest</div></TD>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colNormal">normaltest</TD>
        <TD WIDTH="20%" HEIGHT="100%" VALIGN="top" ID="colRight">right</TD>
    </TR>
</TABLE>
Avatar billede w13 Novice
24. juli 2008 - 14:51 #17
Men det er vel egentlig linjemæssigt, ikke? Altså som jeg ser det ignorerer vertical-align parentelement og justerer derimod - som du siger - i forhold til de andre elementer på en linje.
Avatar billede w13 Novice
24. juli 2008 - 14:52 #18
rossoneris>> Nej, du har flyttet den ind i style-attributten, og det går ikke.

<TABLE WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0">
    <TR>
        <TD style="vertical-align:top;width:40px;height:15em"><div style="height:100%;overflow:auto" id="colLeft">leftest</div></TD>
        <TD WIDTH="40%" HEIGHT="100%" VALIGN="top" ID="colNormal">normaltest</TD>
        <TD WIDTH="20%" HEIGHT="100%" VALIGN="top" ID="colRight">right</TD>
    </TR>
</TABLE>
Avatar billede w13 Novice
24. juli 2008 - 14:53 #19
I øvrigt bør du nok overveje at skrive med små bogstaver, hvis din kode skal være fremtidssikker.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 20:51 Knap til ipad Af FinnLauridsen i Excel
21/0113:53 Icloud mail via Outlook Af lbc i E-mail programmer
21/0108:32 USB NØGLE gratis Af nu_igen i Andet hardware
20/0121:11 Hvordan får jeg reCAPTCHA på min hjemmeside? Af Strawberry i PHP
20/0116:10 Tomt felt i Start Af ErikHg i Windows
White papers
Flere white papers »