Søg
Avatar billede matz Nybegynder
17. februar 2006 - 08:45 Der er 12 kommentarer og
1 løsning

Top og bund skal tilpasses efter skærmopløsning

hvordan tilpasser man ens tabel efter en skærmopløsning? Altså hvor top er helt oppe og bund er helt nede ved statuslinjen hver gang ved forskellige skærmopløsninger.

Se siden her: www.playboi.dk/bf/
Avatar billede mitbrugernavn Praktikant
17. februar 2006 - 09:20 #1
hej
angiv række højde i procenter og lav din tabel i 100 % højde ->


<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<div align="center">
  <table width="500" height="100%" border="1" cellpadding="0" cellspacing="2">
    <tr>
      <td height="10%" valign="top">
        <div align="left"><br>
          &nbsp;&nbsp;<a href="index.htm">Forside</a> | <a href="nyheder.htm" target="I1">Nyheder</a> | <a href="bobf.htm" target="I1">Bag Om Battlefield 2</a> | <a href="billeder.htm" target="I1">Billeder</a> | <a href="download.htm" target="I1">Download</a>    </div>   
          <div align="right"><a href="index1.htm"><img src="1.jpg" border="0"></a><a href="index3.htm"><img src="2.jpg" border="0"></a><a href="index4.htm"><img src="3.jpg" border="0"></a>&nbsp;&nbsp;</div>
          <div align="center"><img src="top.jpg" border="1"></div>
          <br>
            <iframe name="I1" width="550" height="230" border="0" frameborder="0" scrolling="yes"  src="index2.htm">
            Browseren understøtter ikke indbyggede rammer eller er aktuelt konfigureret til ikke at vise indbyggede rammer.</iframe>
            <br><hr>
</td>
    </tr>
    <tr>
      <td>test</td>
    </tr>
    <tr>
      <td height="10%">bund</td>
    </tr>
  </table>
</div>
</body>
</html>
Avatar billede matz Nybegynder
17. februar 2006 - 09:40 #2
mitbrugernavn >> Den bliver ikke tilpasset skærmopløsningen i top og bund :/
Avatar billede milandt Nybegynder
17. februar 2006 - 09:46 #3
prøv at sætte

html, body {height:100%;margin:0;
tabel.mintabel {height:100%;}
Avatar billede mitbrugernavn Praktikant
17. februar 2006 - 09:58 #4
undskyld - er lidt nyt - hvor din iframe følger med:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<div align="center">
  <table width="500" height="100%" border="1" cellpadding="0" cellspacing="2">
    <tr>
      <td height="10%" valign="top">
        <div align="left"><br>
          &nbsp;&nbsp;<a href="index.htm">Forside</a> | <a href="nyheder.htm" target="I1">Nyheder</a> | <a href="bobf.htm" target="I1">Bag Om Battlefield 2</a> | <a href="billeder.htm" target="I1">Billeder</a> | <a href="download.htm" target="I1">Download</a>    </div>   
          <div align="right"><a href="index1.htm"><img src="1.jpg" border="0"></a><a href="index3.htm"><img src="2.jpg" border="0"></a><a href="index4.htm"><img src="3.jpg" border="0"></a>&nbsp;&nbsp;</div>
          <div align="center"><img src="top.jpg" border="1"></div>
       
</td>
    </tr>
    <tr>
      <td > <br>  <iframe name="I1" width="550" height="95%" border="0" frameborder="0" scrolling="yes"  src="index2.htm">
            Browseren understøtter ikke indbyggede rammer eller er aktuelt konfigureret til ikke at vise indbyggede rammer.</iframe>
    </td>
    </tr>
    <tr>
      <td height="10%">  <hr>bund</td>
    </tr>
  </table>
</div>
</body>
</html>
Avatar billede milandt Nybegynder
17. februar 2006 - 10:15 #5
mitbrugernavn : "angiv række højde i procenter og lav din tabel i 100 % højde"

Et element med relativ height/width vil altid være x% af parent elementet. Hvis du angiver 100% højde på en tabel kan du ikke forvente at den bliver 100% af sidens højde, med mindre du også har angivet html og body til at have height 100%.

Løsningen er som jeg skrev tidligere, og at angive en fast højde på top og bund og ingen på "content" rækken, så vil den fylde den resterende plads ud.
Avatar billede mitbrugernavn Praktikant
17. februar 2006 - 10:40 #6
-->  milandt : Løsningen er som jeg skrev tidligere, og at angive en fast højde på top og bund og ingen på "content" rækken, så vil den fylde den resterende plads ud.
???? hvor har du skrevet dette.

Men korrekt det er nøjagtig det samme som i det stykke kode jeg lagde ud sidst.:-O

mitbrugernavn
Avatar billede milandt Nybegynder
17. februar 2006 - 11:10 #7
Løsningen er som jeg skrev tidligere [ html, body {height:100%;margin:0;tabel.mintabel {height:100%;} ], og [ som i incl ] at angive en fast højde på top og bund og ingen på "content" rækken, så vil den fylde den resterende plads ud.

Nej, i det sidste du skrev har du ikke angivet højder på html og body.
Avatar billede matz Nybegynder
17. februar 2006 - 12:50 #8
Det virker stadig væk ikke.. :/
Avatar billede roenving Novice
17. februar 2006 - 15:43 #9
-- og mitbrugernavns løsninger er baseret på browsere i quirksmode, hvor miland tænker på dokumenter, hvor der er sat en fuld doctype ind, så de er helt ved siden af hinanden (i øvrigt er der overhovedet ikke en eneste html-standard, der endu har inkluderet height-attributten på et table-element !-)

-- så når du bruger en sådan doctype, skal du tage milandts måde at gøre tingene på, dog skal du huske at afslutte html,body style-reglen !o]
Avatar billede matz Nybegynder
17. februar 2006 - 20:43 #10
Jeg kan stadig ik få den til at virke, koden er således:

html,body{margin:0; padding:0; height:100%;}
html{
scrollbar-face-color: #fff;
scrollbar-highlight-color: #fff;
scrollbar-shadow-color: #000;
scrollbar-3dlight-color: #369;
scrollbar-arrow-color: #000;
scrollbar-track-color: #fff;
scrollbar-darkshadow-color: #fff;
}
body{
font-size:10px;
font-family:verdana, sans-serif;

}
.table.mintabel {height:100%;}
    FONT-SIZE: 10pt; FONT-FAMILY: Verdana
}
.header {
    FONT-SIZE: 9pt; BACKGROUND: #ffffff; FONT-FAMILY: Verdana
}
A {
    TEXT-DECORATION: none
}
A:link {
    COLOR: #000000; TEXT-DECORATION: none
}
A:visited {
    COLOR: #000000; TEXT-DECORATION: none
}
A:active {
    COLOR: #000000; TEXT-DECORATION: none
}
A:hover {
    COLOR: #336699; TEXT-DECORATION: none
}
.input {
   
}
.button {
    BORDER-TOP-WIDTH: 1px; BORDER-LEFT-WIDTH: 1px; FONT-SIZE: 9px; BORDER-LEFT-COLOR: #000000; BORDER-BOTTOM-WIDTH: 1px; BORDER-BOTTOM-COLOR: #000000; COLOR: #000000; BORDER-TOP-COLOR: #000000; FONT-FAMILY: verdana; BORDER-RIGHT-WIDTH: 1px; BORDER-RIGHT-COLOR: #000000; BACKGROLOR: #6699cc
}
Avatar billede roenving Novice
18. februar 2006 - 13:08 #11
-- du har da også en del fejl i din css ...

table.mintabel {
    height:100%;
    font-size: 10px; font-family: verdana,sans-serif;
}

-- og det skal vel også være input og button og ikke .input/.button ?-)

-- og hvad er det for en forfærdelig kodegenerator, der kan finde på at skrive det vås, der er sat på button ?o]

button{
  border:1px solid black;
  color:black;
  background-color: #69c;
  font-size:9px;
  font-family:verdana,sans-serif;
}
Avatar billede matz Nybegynder
18. februar 2006 - 19:26 #12
Jamen den tilpasser sig stadigvæk ikke efter skærmopløsning - og jeg forstår det ikke?

html,body{margin:0; padding:0; height:100%;}
html{
scrollbar-face-color: #fff;
scrollbar-highlight-color: #fff;
scrollbar-shadow-color: #000;
scrollbar-3dlight-color: #369;
scrollbar-arrow-color: #000;
scrollbar-track-color: #fff;
scrollbar-darkshadow-color: #fff;
}
body{
font-size:10px;
font-family:verdana, sans-serif;

}
table.mintabel {
    height:100%;
    font-size: 10px; font-family: verdana,sans-serif;
}
.header {
    FONT-SIZE: 9pt; BACKGROUND: #ffffff; FONT-FAMILY: Verdana
}
A {
    TEXT-DECORATION: none
}
A:link {
    COLOR: #000000; TEXT-DECORATION: none
}
A:visited {
    COLOR: #000000; TEXT-DECORATION: none
}
A:active {
    COLOR: #000000; TEXT-DECORATION: none
}
A:hover {
    COLOR: #336699; TEXT-DECORATION: none
}
button{
  border:1px solid black;
  color:black;
  background-color: #69c;
  font-size:9px;
  font-family:verdana,sans-serif;
}

- Desuden har jeg et spørgsmål: Hvordan kan det være man ikke skriver 6 cifre i farvekoden i css? eks. "#69c"
Avatar billede roenving Novice
24. februar 2006 - 16:31 #13
I css kan du bruge en række forskellige notationer til farvekoder, bla. farvenavn ('red' m.m.m.), hexkode fuld eller forkortet (#6699cc er det samme som #69c) eller med rgb-værdier (rgb(102,153,204) er det samme som #6699cc !-)

-- se f.eks. http://blooberry.com/indexdot/css/syntax/units/color.htm !o]
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 14:53 TV4ever 3.0 Af valby i Diverse
01/0816:21 Installere Ubuntu på Virtuel Maskine Af Uvanga i Andet software
01/0809:38 Microsoft har igen ødelagt mit højreklik Af valby i Windows
30/0714:41 To mails fra YouSee - Jeg tror ikke altid på tilfældigheder Af mort1 i Andet sikkerhed
27/0714:34 Hjælp til at kunne skanne negativer på Plustek 8300i SE Af Mariann i Foto & video
White papers
Flere white papers »