Avatar billede qualon1 Nybegynder
26. oktober 2006 - 16:56 Der er 3 kommentarer

fylde hele siden

Hej

Jeg er ved at lave et design, hvor jeg gerne vil have et design der fylder hele siden. Jeg har lavet noget af det, men jeg ønsker at lave det valid og skal derfor bruge en doctype. Hvis jeg ikke har denne med virker det, men når den er der, så kan jeg ikke lave siden fuld højde.
Så mit problem er egentlig at den tabel skal fylde hele browseren, altså 100% bredde og 100% højde
Jeg har lavet følgende:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled</title>
<style type="text/ccs">
BODY {
    margin: 0px;
}
td.header_main {
    background:#ffefae url('images/header_background.gif') repeat-y top left;
    border-bottom: 1px solid #8cb2bf;
    height: 73px;
}
td.footer_main {
    border-top: 1px solid #8cb2bf;
    height: 62px;
}
table.container_table {
    border: 1px solid #8cb2bf;
    height:100%;
}
</style>
</head>
<body>
    <table cellspacing="0" cellpadding="0" width="100%" height="100%" class="container_table">
        <!-- HEADER -->
        <tr>
            <td width="100%" class="header_main">
                d
               
               
            </td>
        </tr>
        <!-- /HEADER -->
       
        <!-- CONTENT -->
        <tr>
            <td width="100%" height="100%" style="height:100%;">
                <table cellspacing="0" cellpadding="0" width="100%" height="100%">
                    <tr>
                        <td height="100%">hej</td>
                    </tr>
                </table>
            </td>
        </tr>
        <!-- /CONTENT -->
    </table>
</body>
</html>
Avatar billede jannek_ek Nybegynder
26. oktober 2006 - 20:15 #1
tilføj:

height: 100%;
width: 100%;
bordercollapse: collapse;

til dit stylesheet, og slet de atributter du har lagt i selve table-tagget.
Du skal helst definere så meget som muligt i dit styleseet når du arbejder med xhtml
Avatar billede kinderaeg Nybegynder
27. oktober 2006 - 09:47 #2
Height er også elementets højde i forhold til parent'en, så du skal også huske at sætte højden (100%) på body og html
Avatar billede olebole Juniormester
27. oktober 2006 - 11:25 #3
<ole>

Din DTD stemmer ikke overens med din kode, så du bør nok vælge HTML4.01-Trans:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">

Dernæst bør du vide, at der aldrig har været en height-attribut på et table-element ... højden skal sættes med CSS:
    <table style="height:100%" ..........>

Desuden foreskriver CSS, at når en højde sættes i procent, skal browseren beregne den udfra det omkransende elements højde - som altså eksplicit skal være sat:

<style type="text/ccs">
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
}
</style>

/mvh
</bole>
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