Hvorfor driller td height?

Der skal gerne være noget mellem td'erne. Indsæt et mellemrum.
<td height="100%" style="width: 1px;" class="bgcolor">&nbsp;</td>

Hej fennec!

Hvis jeg sætter et hårdt mellemrum ind mellem td'erne, kan den ikke holdes i 1 px, så vil cellen blive et hårdt mellem bred.

... så vil cellen blive et hårdt mellemrum bred, skulle der stå :o)

så sæt et overflov:hidden; i dit style også. Så skulle det gerne forsvinde.

Det hjalp lidt, men cellen er et hårdt mellemrum bred, og den er stadig ikke 100% minus de 20 px i bund og top

<td style="overflov: hidden; width: 1px;" height="100%">&nbsp;</td>

Er det ikke overflow? Eller er det overflov?

Du har ret. Det var lige en lille tastefejl fra min side :o)

10-4 :o)

Jeg har også lavet en transparent GIF: bredde 1px højde 20 px - og sat den ind i den øverste og den nederste celle for at se, om jeg så kunne tvinge højden op, uden at det ville gå ud over højden på den øverste og den nederste celle. Men det hjalp intet.

<td style="width: 1px; height: 20px;"><img border="0" src="/images/1x20.gif" width="1" height="20" alt=""></td>

Jeg har lavet dette her før, men jeg rodede så meget rundt i det for at få det til at virke, at jeg aldrig blev helt klar over, hvorfor det kom til at virke.

Det er ikke sådan at du sætter en anden brede til td'erne før eller efter denne <tr>???

Du får lige hele tabellen:

                <table border="0" cellpadding="0" cellspacing="0" width="100%" class="paper tekst8">
                    <tr>
                        <td valign="top" align="left" style="width: 228px; padding: 12px 12px 12px 12px;" rowspan="3">&nbsp;</td>
                        <td style="width: 1px; height: 20px;"><img border="0" src="/images/1x20.gif" width="1" height="20" alt=""></td>
                        <td valign="top" align="left" style="width: 228px; padding: 12px 12px 12px 12px;" rowspan="3">
                            <b>Læs    også:</b>
                            <ul>
                                <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">netetikette</a></li>
                                <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">ophavsret</a></li>
                                <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">personlige oplysninger</a></li>
                                <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">om include.dk</a></li>
                            </ul>
                        </td>
                    </tr>
                    <tr>
                        <td height="100%" style="width: 1px; background-color: #CCCCCC;">
                            <table border="0" cellpadding="0" cellspacing="0">
                                    <tr>
                                            <td style="overflow: hidden; width: 1px;" height="100%"></td>
                                    </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td style="width: 1px; height: 20px;"><img border="0" src="/images/1x20.gif" width="1" height="20" alt=""></td>
                    </tr>
                </table>

Det er ikke lige til at få noget ud af?

jeg havde lige gang i noget andet. Kikker på det om ca 15 min. Jeg har dog set et par ting....

Ok, venter i spænding :o)

Jeg kigger ind senere. Håber du finder ud af noget :o)

her er hvad jeg har fundet ud af:

<table border="1" cellpadding="0" cellspacing="0" class="paper tekst8">
<tr>
    <td valign="top" style="width: 228px;">Tekst her</td>
    <td style="width:1px;height:100%;overflow:hidden;padding:0,0,0,0;">
        <div style="height:100%;width:5px;overflow:hidden;padding:0,0,0,0;">
        <table height="100%" cellpadding="0" cellspacing="0">
        <tr>
            <td height="1%" style="height:10px;overflow:hidden;"></td>
        </tr>
        <tr>
            <td height="98%" style="background-color: #CCCCCC;">&nbsp;</td>
        </tr>
        <tr>
            <td height="1%" style="height:10px;overflow:hidden;"></td>
        </tr>
        </table>
        </div>
    </td>
    <td valign="top" style="width: 228px;">
        <b>Læs    også:</b>
          <ul>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">netetikette</a></li>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">ophavsret</a></li>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">personlige oplysninger</a></li>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">om include.dk</a></li>
          </ul>
    </td>
</tr>
</table>

Breden er sat til 5px for at gøre det nemmere at se, men den kan du bare sæt ned til 1px i div'en.

Hm, det ser ikke så godt ud, den er ikke rigtig, og tabellen er helt forskubbet.

Det ser udemærket ud hos mig. Har du en url hvor jeg kan se din???

Øjeblik, prøver igen

Denne her:

<td height="1%" style="height:10px;overflow:hidden;"></td>

Skal den ikke laves om til

<td width="1%" style="height:10px;overflow:hidden;"></td>

...?

Den er der sq! Lægger du et svar? :o)

du behøver faktisk ikke de 3 height="xx%". Det er gamle forsøg som bliver overskrevet i style.

Jeg ville have 12 px hele vejen rundt, men det får jeg ikke. Er det <div>, der overruler?

<div style="height:100%;width:5px;overflow:hidden;padding:0,0,0,0;">

Sludder

Jeg kan ikke få de 12 px. Og når tabellen kommer ind i td, forrykker det hele sig :o(

.... og den lodrette linie bliver lille igen

Nej, det forrykker sig, fordi jeg ikke får de 12 px hele vejen rundt. Hvorfor får jeg ikke det?. Og stregen bliver lille igen. Spændende ... :o)

du må ikke ændre paddingen på div'en og den td den er i. Men du kan godt sætte padding på de to tekst felter...

Det har jeg gjort: <td valign="top" style="width:228px; padding:12,12,12,12;">

Og jeg har ladet denne være:

    <td style="width:1px;height:100%;overflow:hidden;padding:0,0,0,0;">
        <div style="height:100%;width:1px;overflow:hidden;padding:0,0,0,0;">
        <table height="100%" cellpadding="0" cellspacing="0">
        <tr>
            <td style="height:20px;overflow:hidden;"></td>
        </tr>
        <tr>
            <td style="background-color: #CCCCCC;">&nbsp;</td>
        </tr>
        <tr>
            <td style="height:20px;overflow:hidden;"></td>
        </tr>
        </table>
        </div>
    </td>

det var ikke helt rigtigt det jeg der sagde. Du må ikke ændre på div'en men du må godt ændre på td'en. Du skal bare huske at ændre breden på td'en ellers forsvinder indholdet pga overflow:hidden

Ok, den ser sådan her ud nu:

            <td valign="top" align="left" style="width: 505px;" colspan="2">
<table border="0" cellpadding="0" cellspacing="0" class="paper tekst8">
<tr>
    <td valign="top" style="width:228px; padding:12,12,12,12;">Teksten kommer her</td>
    <td style="width:1px;height:100%;overflow:hidden;padding:0,0,0,0;">
        <div style="height:100%;width:1px;overflow:hidden;padding:0,0,0,0;">
        <table height="100%" cellpadding="0" cellspacing="0">
        <tr>
            <td style="height:20px;overflow:hidden;"></td>
        </tr>
        <tr>
            <td style="background-color: #CCCCCC;">&nbsp;</td>
        </tr>
        <tr>
            <td style="height:20px;overflow:hidden;"></td>
        </tr>
        </table>
        </div>
    </td>
    <td valign="top" style="width:228px; padding:12,12,12,12;">
        <b>Læs også:</b>
          <ul>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">netetikette</a></li>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">ophavsret</a></li>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">personlige oplysninger</a></li>
            <li><a href="#" style="display: block;width: 100%;" onFocus="this.blur();">om include.dk</a></li>
          </ul>
    </td>
</tr>
</table>
            </td>

www.include.dk og www.include.dk/default1.asp

Du kan ikke se fejlen?

Det virker fint på default1.asp men ikke på include.dk er vi enige om det???

uanset hvad er der uoverensstemmelser på brederne på include.dk.
505px; <=> 228px; + 1px; + 228px;

Ja, så er der 48 px i overskud, men der er 2 celler med hver 12 px i padding. Så passer pengene. Problemet er de 4 x 12 px, + at stregen er blevet lille igen.

(2 x 228) + 1 = 457
4 x 12 = 48

457 + 48 = 505

Blive paddingen ikke trukket fra breden....
Jeg kan ikke forstå hvorfor stregen bliver lille igen. Prøv lige at sætte border på så vi kan se tabellerne.

Nej, padding går med ind i bredden. Jeg havde bredden oprindeligt til 252.

Sætter lige border på ...

Den er sat på

kan du ikke lige sætte den på "den store" tabel også.

Det er gjort

I den 3. række, 1. celle, kan du se noget hvid tekst. Sådan skulle det også gerne stå i de 2 celler :o)

jeg kan absolut ikke forstå hvorfor den ikke vil vise stregen rigtigt. Hvis du gør div'en bredere kan du se at tabellen inden i ikke er 100% af højden, hvilket den ellers er sat til....

Nej, det er mystisk. Jeg har lige sat div'en til 48, og nu er den store tabel på plads. Men det er resten jo ikke.

Skidt med det. Jeg finder på noget andet. Men hvis nu 10-øren pludselig falder, må du meget gerne råbe højt :o)

Du skal have 354563376357 tak for din indsats, fennec

Men har du 3 rækker i en kolonne, og den øverste og den nederste række er f.eks. 20 px i højden, så burde den midterste (i teorien) strække sig ud, hvis den celle til højre bliver fyldt ud med en masse tekst, som laver noget højde. Er det ikke korrekt?

jeg kikker måske på det i aften. Så må vi se om det lykkes...

Det ville være fint, hvis det lykkes. Men få ikke stress over det, så finder jeg bare på noget andet :o)

Jeg har denne stående øverst i data.asp, som jeg inkluderer i toppen af alle dokumenter:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Den har jeg fjernet. Prøv at se nu.

Vi kigger på det i aften :o)

OK.

Men hvorfor i alverden ødelægger "loose.dtd" koden?????

Der er meget bøvl, hvis man skal overholde W3C's standarder. Jeg havde også bøvl med en Coolmenu fra dhtmlcentral.com. Da jeg fjernede den, virkede menuen korrekt.

Jeg tror du har ret i, at padding ikke bliver trukket fra cellens bredde, sorry :o)

Det er klart, padding trækker teksten xx pixels fra cellens top, højre kant etc. padding bliver ikke trukket fra cellens bredde.

fennec, den er lige i øjet, og jeg gider ikke rode mere med det. Over 95% af alle browsere er alligevel MSIE, så jeg er mere end tilfreds :o)

TAK for din store indsats :o)