Avatar billede netapplication Nybegynder
17. maj 2004 - 10:48 Der er 27 kommentarer og
1 løsning

Tabel i bunden tilpasser sig opløsning?

Hej,

Hvis man i 1024*768 placere en tabel midt på siden med en højde af 574 så fylder den hele skærmen uden at lave scrollbar. Hvis en med en højere opløsning 1200*??? kom forbi ville der opstår et hvidt feldt unden tabellen.

Problem:
Jeg har eksperimenteret lidt med at placere endnu en tabel nedenunder og sat højden til 100% - desværre tilpasser den sig ikke just efter noget som helst.

Spørgsmål:
Så hvordan undgår man dette fine hvid felt/rum?

Rgs
- nettapp
Avatar billede bpuschl Nybegynder
17. maj 2004 - 11:02 #1
Via javascript kan du fange brugerens opløsning på skærmen og herved sætte din højde på tabellen. Denne løsning fungere dog ikke ved resize af browseren :-(

Jeg kan forstille mig at dit problem er at du gerne vil have en venstre og højremargin som er en anden farven en midtersektionen. Dette kan også løses ved at lave et baggrundsbillede som er f.eks. 1024 x 20 og som har den ønskede farve i venstre og højre side (og hvid i midten).
Avatar billede netapplication Nybegynder
17. maj 2004 - 11:35 #2
Takker for forslagene.

Javsscript modellen er jeg ikke meget for - har det med at gå helt galt arhm.

Den anden metode er mere interesant. Problemet er jo bare at et sådan billede skal være 1024 i breden og folk med en anden højde har jo også en anden brede. Dvs. at billede ikke kommer til at dække i breden ved f.eks 1152 x 864.

Jeg prøvede så at lave billedet i 2000x20 således at højre/venstre side var sorte og ca 700pix i midten var hvide. Desværre bliver det ikke centret som baggrundebillede. Hvordan gør man lige det?
Avatar billede jps6kb Novice
17. maj 2004 - 12:08 #3
Kan du ikke prøve at lave et img / screenshot af det du mener ?
Avatar billede roenving Novice
17. maj 2004 - 12:12 #4
Denne simple metode skulle være cross-browser nok til at den skulle du overalt i nutidige browsere:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Tomt dokument</title>
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/499191">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;text-align:center;background:#666;border:0px;}
#container{height:100%;margin:0px auto;width:574px;background:#e76;text-align:left;}
</style>
<script language="javascript" type="text/javascript">

</script>
</head>
<body>
<div id="container">

<!-- hele din side -->

</div>
</body>
</html>
Avatar billede netapplication Nybegynder
17. maj 2004 - 13:48 #5
Ok nice nok - men hvordan splitter man midten op i f.eks blå/organge?
Avatar billede roenving Novice
17. maj 2004 - 13:54 #6
#top{background:#00a;height:120px;}


<div id="container">
<div id="top"></div>
Avatar billede netapplication Nybegynder
17. maj 2004 - 13:58 #7
hmm det virker vist heller ik helt. Man kan ikke placere en tabel inde i <div> uden at udvige den, og hvis man placere en tabel uden for <div> skubber siden sig og man er lige vidt.
Avatar billede roenving Novice
17. maj 2004 - 14:02 #8
#container{position:relative;height:100%;margin:0px auto;width:574px;background:#e76;text-align:left;overflow:hidden;}
Avatar billede netapplication Nybegynder
17. maj 2004 - 14:04 #9
Det var nu op langs og ikke tværds jeg mente, og desværre så kommer det samme tabel-udvigelses-problem også her.
Avatar billede roenving Novice
17. maj 2004 - 14:10 #10
Øeh, når overflow:hidden; er på, vil den da ikke blive udvidet ?-)
Avatar billede netapplication Nybegynder
17. maj 2004 - 14:10 #11
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Tomt dokument</title>
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/499191">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;text-align:center;background:#666;border:0px;}
#container{position:relative;height:100%;margin:0px auto;width:574px;background:#e76;text-align:left;overflow:hidden;}
#top{background:#00a;height:120px;width:840px}
</style>
<script language="javascript" type="text/javascript">

</script>
</head>
<body>
<div id="container">
  <div id="top"> </div>
</div></body>
</html>


--------------

Øhh... hvad skulle det ændre?
Avatar billede netapplication Nybegynder
17. maj 2004 - 14:12 #12
Hvordan bruger man overflow?
Avatar billede roenving Novice
17. maj 2004 - 14:18 #13
Det er da bedøvende, om du sætter en bredde eller højde på noget inde i div'en !-)

Men jeg er sikker på, at vi snakker forbi hinanden, så måske du kunne prøve at fortælle lidt mere om, hvad det er, du vil ...
Avatar billede netapplication Nybegynder
17. maj 2004 - 14:47 #14
Nej ikke bedøvende... hvis jeg sætter div til 600 og placere en tabel på 740px bred inde i denne bliver højre del af tabellen cuttet af.

Jeg "vil havde" en top som fylder hele siden. Dernæste skal venstre siden være en farve, så kommer midten som skal være 2 farvet, og til sidste højre side som skal være samme farve som venstre.
Avatar billede netapplication Nybegynder
17. maj 2004 - 14:50 #15
---------------------
|                  |
|                  |
---------------------
|    | |    |      |
|    | |    |      |
|    | |    |      |
|    | |    |      |
|    | |    |      |
---------------------
Avatar billede netapplication Nybegynder
17. maj 2004 - 14:51 #16
Top med et eller andet.
Venstret side FARVE 1, Midten delt i 2, højre side FARVE 1
Avatar billede roenving Novice
17. maj 2004 - 15:02 #17
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Tomt dokument</title>
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/499191">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;text-align:center;background:#666;border:0px;}
#container{position:relative;height:100%;margin:0px auto;width:574px;background:#e76;text-align:left;overflow:hidden;}
#top{position:absolute;left:0px;width:100%;background:#00a;height:120px;text-align:center;z-index:1;color:#a5a;font-weight:900;}
#spacer{background:#00a;height:120px;width:840px;}
</style>
<script language="javascript" type="text/javascript">

</script>
</head>
<body>
<div id="top">Dit topbanner o.l.</div>
<div id="container">
<div id="spacer">Dette er usynligt</div>
<!-- hele din side -->
<table style="width:574px;background:yellow;">
  <tr>
    <td>celle</td>
  </tr>
</table>
</div>
</body>
</html>
Avatar billede netapplication Nybegynder
17. maj 2004 - 15:05 #18
Ah!

Kan den lade sige gøre at flække midten på langs? Lige nu er den der gule bjælke på tværds.
Avatar billede roenving Novice
17. maj 2004 - 15:08 #19
Jo, da, du kan f.eks. bruge to celler i en tabelrække ...
Avatar billede netapplication Nybegynder
17. maj 2004 - 15:10 #20
Åh ja - troede lige det ville skabe samme problemer som tidligere (forskydning).

Lav et svar :))
Avatar billede roenving Novice
17. maj 2004 - 15:19 #21
Så er det måske dette:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Tomt dokument</title>
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/499191">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;text-align:center;background:#666;border:0px;}
#container{position:relative;height:100%;margin:0px auto;width:574px;background:#eee;text-align:left;overflow:hidden;}
#container1{position:relative;height:100%;margin:0px;width:287px;background:#e76;text-align:left;overflow:hidden;float:left;}
#container2{position:relative;height:100%;margin:0px;width:287px;background:#7e6;text-align:left;overflow:hidden;float:left;}
#top{position:absolute;left:0px;width:100%;background:#00a;height:120px;text-align:center;z-index:1;color:#a5a;font-weight:900;}
.spacer{background:#00a;height:120px;width:840px;}
</style>
<script language="javascript" type="text/javascript">

</script>
</head>
<body>
<div id="top">Dit topbanner o.l.</div>
<div id="container">
  <div id="container1">
    <div class="spacer">Dette er usynligt</div>
    <!-- hele din side -->
    <table style="width:574px;background:yellow;">
      <tr>
        <td>celle</td>
      </tr>
    </table>
  </div>
  <div id="container2">
    <div class="spacer">Dette er usynligt</div>
    <!-- hele din side -->
    <table style="width:574px;background:yellow;">
      <tr>
        <td>celle</td>
      </tr>
    </table>
  </div>
</div>
</body>
</html>

-- og velbekomme !-)
Avatar billede netapplication Nybegynder
17. maj 2004 - 15:23 #22
Ak og ve - virker netop ikke.

Hvis jeg bare smider en tabel ind i midten så kommer den jo til at stå for farvevalget.
Avatar billede roenving Novice
17. maj 2004 - 15:24 #23
Men med de to divs ?-)
Avatar billede netapplication Nybegynder
17. maj 2004 - 15:26 #24
lol - mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange  mange mange TAKKER!

Lav svar :)
Avatar billede roenving Novice
17. maj 2004 - 15:33 #25
-- og tak for point ;~}
Avatar billede netapplication Nybegynder
21. maj 2004 - 14:41 #26
Ikke for noget men der virker ikke helt alligevel... i 1024 * 768 ser det fint ud men i 800*600 bliver bunden cuttet.
Avatar billede roenving Novice
21. maj 2004 - 15:04 #27
Den eneste måde, jeg kunne få eksemplet til at skære bunden af, var ved at der ikke var plads i bredden, så der kom en scrollbar i bunden, som selvfølgelig lagde sig ovenpå det nederste af siden !-)
Avatar billede netapplication Nybegynder
21. maj 2004 - 15:27 #28
mmm... jeg placerede en tabel i midter sektionen på 740 bred og 449 width. I 1024 kunne jeg se hele siden, men i 800*600 var halvdelen af tabellen cuttet midt over (så lidt sjovt ud).

Jeg tror dog jeg kan løse det med lidt enkelt tabel-sjov.
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