Avatar billede Max Novice
08. september 2005 - 11:50 Der er 11 kommentarer og
1 løsning

Tabel-problemer i HTML og CSS (iFrames)

Hej alle.
Jeg har et problem med mine tabeller, og jeg er - må jeg sige - totalt blank! Problemet tror jeg ligger i min midterste tabel. Når jeg sætter en Iframe ind i den, forsvinder den nederste tabel. Det skal siges, at det er meningen, at det er 3 separate tabeller, da jeg senere skal have lavet noget ved størrelsen på cellerne. Højde og bredde på min Iframe, er sat til 100px på hver led, men det er meningen, at den skal være 100% x 100%.

Er der nogen, der kan forklare mig, hvad der går galt, og hvad jeg kan gøre for at rette det? Koden kommer herunder (se venligst bort fra unødvendige css-elementer; dette er min testmodel)

----> Min HTML kode <----
<html>
    <head>
        <title>Test</title>
        <link rel="stylesheet" href="CSS/Main.css" type="text/css" />
    </head>
    <body>
        <table class="bodycontainer">
              <tr>
                  <td>
                      <table class="menu">
                        <tr class="over">
                            <td class="test">a1</td>
                            <td class="test">a2</td>
                            <td class="test">a3</td>
                            <td class="test">a4</td>
                            <td class="test">a5</td>
                            <td class="test">a6</td>
                            <td class="test">a7</td>
                        </tr>
                    </table>

                    <table class="indhold">
                        <tr>
                            <td class="test">
                                <iframe class="cont" frameborder="0" id="vindue" src="HTML/homedk.html" />
                            </td>
                        </tr>
                    </table>

                    <table class="menu">
                        <tr class="over">
                            <td class="test">c1</td>
                            <td class="test">c2</td>
                            <td class="test">c3</td>
                            <td class="test">c4</td>
                            <td class="test">c5</td>
                            <td class="test">c6</td>
                            <td class="test">c7</td>
                        </tr>
                    </table>

                  </td>
            </tr>
        </table>
    </body>
</html>


----> Min CSS kode <----
body {
    background-color: #FFFFFF;
    color: #A9A9A9;
    border: none;
    margin: 0px;
    padding: 0px;
    font-family: Verdana;
    font-size: 10px;
}

table.bodycontainer {
    width: 100%;
    height: 100%;
    text-align: center;
    vertical-align: middle;
    table-layout: fixed;
    border: none;
    margin: 0px;
    padding: 0px;
}

div.container {
    width: 960px;
    height: 365px;
    border: none;
}

iframe.cont {
    width: 100px;
    height: 100px;
    border: none;
    margin: 0px;
    padding: 0px;
}

img.menubilledeudst {
    position: absolute;
    left: 0px;
    top: 0px;
}

img.menubilledegall {
    position: relative;
    left: 310px;
    top: 0px;   
}

img.menubilledekasp {
    position: relative;
    left: 310px;
    top: 0px;   
}

table.indhold {
    width: 750px;
    height: 400px;
    vertical-align: top;
    border: solid black 1px;
}

table.menu {
    width: 750px;
    height: 13px;
    border: solid red 1px;
}

tr.over {
    height: 13px;
    border: solid black 1px;
}

td.test {
    border: solid black 1px;
}



- Jeg håber I kan hjjælpe mig.

Mvh.
/Mnc
Avatar billede olebole Juniormester
08. september 2005 - 12:16 #1
<ole>

Bruger du en DTD, der tillader brug af CSS? F.eks. denne:
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Desuden skal både documentElement- og body-elementerne have sat en højde ... ellers har CSS ikke noget at beregne højden på 100% udfra  ;o)

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

/mvh
</bole>
Avatar billede olebole Juniormester
08. september 2005 - 12:18 #2
- og så skal din celle med klassen 'test' have sat en højde - ellers kan CSS heller ikke beregne en procentuel højde på din iframe .... 100% af hvad?  :)
Avatar billede olebole Juniormester
08. september 2005 - 12:20 #3
- og så burde du nok læse disse to:
    http://www.eksperten.dk/artikler/537
    http://www.eksperten.dk/artikler/538

De beskriver, hvorfor XHTML er en elendig standard at skrive i til dagens WWW - og hvorfor de tilgængelige XHTML-versioner ikke er til nogen hælp, når XHTML endelig bliver brugbart
Avatar billede Max Novice
08. september 2005 - 12:22 #4
Ups.. Fik ikke første linie med; er det ikke ok med :
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">  ?

/Mnc
Avatar billede Max Novice
08. september 2005 - 12:24 #5
.. og body-elementerne forstår jeg, men documentElement? :-/
Avatar billede olebole Juniormester
08. september 2005 - 12:26 #6
Nej, det er ikke nok med den DTD. Bruger du den, kan IE ikke tolke de vigtigste dele af CSS  :)

documentElement er det element, der implementeres med HTML-tag'et. Derfor selctor'en:

html, body { ... osv  :)
Avatar billede Max Novice
08. september 2005 - 12:41 #7
Hmmm.. Den gør stadigvæk det samme. Nederste tabel vises ikke. :(
Avatar billede olebole Juniormester
08. september 2005 - 12:46 #8
Prøv med et link, så man kan se, hvad du prøver
Avatar billede olebole Juniormester
08. september 2005 - 12:52 #9
Sorry ... jeg havde overset din forkerte lukning af iframe'en:
    <iframe class="cont" frameborder="0" id="vindue" src="HTML/homedk.html"></iframe>

I det hele taget må du slet ikke lukke tags med ' />' i HTML  :)
Avatar billede Max Novice
08. september 2005 - 13:00 #10
Hey! Så virker det! :)
Tak for hjælpen. Points på vej. :D
Avatar billede Max Novice
08. september 2005 - 13:01 #11
.. hvis du kommer med et "svar" kan jeg give dig points. ;)
Avatar billede Max Novice
22. september 2005 - 17:51 #12
Ok. Lukker nu. Olebole, hvis du vil have points for svar må du skrive. Tak for hjælpen endnu en gang. :)
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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.

Du kan også logge ind via nedenstående tjenester