[HTML/CSS] Tabelcel te groot!

[user109731]

Goedenavond,

Ik ben bezig met een site die bestaat uit tabellen. Nou heb ik het probleem dat 1 cel veel te lang wordt op het moment dat de tabel heel lang wordt.
Ik heb in CSS height en max-height ingesteld, dat werkt niet (mag dat wel op een tabelcel worden toegepast?). Ook <td height="x"> werkt niet (zelfs in IE, waar het toch wel zou moeten werken?)

Ik heb de search en Google al gebruikt. Een lege cel onderaan heeft ook geen zin.

BVD

PS: zie downloads4u.nl/nieuw/alfabetisch.asp (boven menu)

[ Voor 8% gewijzigd door user109731 op 05-08-2004 22:49 ]

[Sendy]

Nu, ik ben niet echt bereid om je probleem te verhelpen, maar misschien is het handig als je je probleem probeert te vangen in een eenvoudige testcase. Copy-paste dat testcaseje dan hier.

[ Voor 3% gewijzigd door Sendy op 05-08-2004 22:50 ]

[RwD]

Ik kom niet wijs uit jouw HTML pagina, te veel code...

Maar ik gok dat je misschien die cel weg kunt laten dan? Een lege cel heeft vrij weinig nut eerlijk gezegd.

[Elroy]

Ik snap het probleem niet helemaal.
Ik neem aan dat je dat menu bovenaan bedoeld met de letters A t/m Z.
Je vind dat die letters te groot zijn voor het tabel?

In dat geval, maak je toch gewoon de letter-type kleiner.
In je style:

font-size: 10px;

Btw, je hebt onwijs veel junk in je code zitten.
Bijvoorbeeld:

code:

<td></td>

Dit doet niks, kan je weghalen.

[ Voor 20% gewijzigd door Elroy op 05-08-2004 22:55 ]

[Sendy]

Elroy >
Je 'Dit doet niks, kan je weghalen' is onjuist. Cellen na die td's worden zeker wel opgeschoven.

[crisp]

als je fixed dimensions wil hebben, gebruik dan table-layout:fixed in je css en zet de breedte van je cells op vaste waarden.

btw, je menu is veels te ver naar onderen geplaatst in FireFox

[user109731]

Bedankt voor de reacties!

Ik snap het probleem niet helemaal.
Ik neem aan dat je dat menu bovenaan bedoeld met de letters A t/m Z.
Je vind dat die letters te groot zijn voor het tabel?

Ik bedoel dat menu links, met Home enzo.

Probleem is dus dat als ik hoogte 20 maak, IE net doet alsof het procenten zijn en dus hoe langer de tabel, hoe langer de cel.

btw, je menu is veels te ver naar onderen geplaatst in FireFox

Dat is het probleem juist! alleen is het in FF nog wat erger dan in IE6 ja.
Dit gebeurt alleen bij 'alfabetisch' omdat die pagina zo lang is!

Kzal zo ff een codevb. posten.

BVD!

EDIT: reactie op crisp

[ Voor 56% gewijzigd door user109731 op 05-08-2004 23:17 ]

[glashio]

Ik heb naar je 'code' zitten turen op je url. Ik snap niet helemaal wat je bedoeld.
Kan je het in een voorbeeld uitleggen ?

HTML:

<table ..... >
  <tr>
    <td>Home&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    </td>
  </tr>
</table>

En dit dient voor

[user109731]

Zie mijn reactie hierboven.

Ik zal binnekort code-vb maken. Die spaties zijn mischien wat onnodig ja, maar tzit zo:

Als je op de tabelachtergrond klikt doet ie hetook, maar dan zie je niet onderin waar die naar verwijst, nu wel (je hebt zo meer kans om op de hyperlink te klikken. tis niet zo prof., maar twerkt prima.)

Bedankt iig!

EDIT: kwas van plan als alles goed werkt de code te gaan cleanen enzo, dus daarom ist nu een bende, sorry daarvoor.

[ Voor 22% gewijzigd door user109731 op 05-08-2004 23:21 ]

[glashio]

VB_programmer schreef op 05 augustus 2004 @ 23:19:
Als je op de tabelachtergrond klikt doet ie hetook

HTML:

<td onclick="document.location.href='default.asp';" style="width:100%;cursor:hand;text-indent:10px;">Home</td>

Zoiets ?

[crisp]

1) tables nesten
2) valign="top" gebruiken ism eventueel een padding-top
3) geen tables gebruiken voor layout

juist doordat de code zo'n zooitje is zie je door de bomen nu het bos niet meer...

[ Voor 28% gewijzigd door crisp op 05-08-2004 23:26 ]

[pistole]

misschien onzinnige opmerking mijnerzijds, maar als je wilt dat die cel een vaste hoogte heeft, terwijl de tabel variabel in hoogte is, dan [b]moet[b] er onder of boven die cel een andere cel zijn die wel flexibel is in hoogte. Anders gaat het natuurlijk nooit werken...

[crisp]

pistole schreef op 05 augustus 2004 @ 23:29:
misschien onzinnige opmerking mijnerzijds, maar als je wilt dat die cel een vaste hoogte heeft, terwijl de tabel variabel in hoogte is, dan [b]moet[b] er onder of boven die cel een andere cel zijn die wel flexibel is in hoogte. Anders gaat het natuurlijk nooit werken...

en dan begeef je je in de col en rowspan hell, waardoor het temeer duidelijk wordt waarom tables nooit bedoelt zijn geweest voor layout

[Guillome]

Ok, hoe maak je dit dan zonder tabel?

PHP:

            <table cellpadding="0px" cellspacing="0px" bgcolor="#CCCCCC">
              <tr>
                <td rowspan="2"><input id="stepper" type="text" value="2" size="3"  /></td>
                <td>[img]"./_webimages/stepper_up.gif"[/img]</td>
              </tr>
              <tr>
                <td>[img]"./_webimages/stepper_down.gif"[/img]</td>
              </tr>
            </table>

Dat ziet er zo uit:

code:

______________
|      |     |
|      |-----|
|______|_____|

[ Voor 132% gewijzigd door Guillome op 06-08-2004 18:49 ]

[chris]

floats, absoluut positioneren, enz. zet 's wat online wat je bedoelt XLerator.... een png'je ofzo (leest frontpage), nee doe maar een jpg'je

[Guillome]

http://www.cmd.tech.nhl.n...3/stepper/create_poll.php
Die stepper

[ Voor 38% gewijzigd door Guillome op 06-08-2004 19:05 ]

[crisp]

XLerator schreef op 06 augustus 2004 @ 18:46:
Ok, hoe maak je dit dan zonder tabel?
[...]

Gewoon zo:

HTML:

<div id="stepper_box">
  <input id="stepper" type="text" value="2" size="3"  />
  <img id="stepper_up" src="./_webimages/stepper_up.gif" alt="" />
  <img id="stepper_down" src="./_webimages/stepper_down.gif" alt="" />
</div>

en de rest doe je met css

[glashio]

XLerator schreef op 06 augustus 2004 @ 18:46:
Ok, hoe maak je dit dan zonder tabel?

Dit vond ik, en ik moet eerlijk bekennen dat ik ook vaak naar een <table> grijp

[Guillome]

crisp schreef op 06 augustus 2004 @ 19:06:
[...]

Gewoon zo:

HTML:

<div id="stepper_box">
  <input id="stepper" type="text" value="2" size="3"  />
  [img]"./_webimages/stepper_up.gif"[/img]
  [img]"./_webimages/stepper_down.gif"[/img]
</div>

en de rest doe je met css

Ja duh En wat is de CSS dan?

[crisp]

XLerator schreef op 06 augustus 2004 @ 19:07:
[...]

Ja duh En wat is de CSS dan?

het makkelijkst is ws door die images gewoon absoluut te positioneren in de div, en anders door ze rechts te laten floaten. Echt niet moeilijk hoor

[ Voor 5% gewijzigd door crisp op 06-08-2004 19:13 ]

[Guillome]

En dan met margintop ofzo? Anders staan ze op elkaar
Float-right wou, voor zover ik het kon zien, niet echt lukken

edit

code:

<style>
  img{position:absolute;}
  div { width:200px;}
</style>
<div id="stepper_box">
  <input style="height:100px" id="stepper" type="text" value="2" size="3"  />
  [img]"./_webimages/stepper_up.gif"[/img]
  [img]"./_webimages/stepper_down.gif"[/img]
</div>

En

code:

<style>
  img{float:left;}
  div { width:200px;}
</style>
<div id="stepper_box">
  <input style="height:100px" id="stepper" type="text" value="2" size="3"  />
  [img]"./_webimages/stepper_up.gif"[/img]
  [img]"./_webimages/stepper_down.gif"[/img]
</div>

Alleen de 1e werkt wel.

[ Voor 76% gewijzigd door Guillome op 06-08-2004 19:15 ]

[crisp]

hiermee kom je een stuk verder:

Cascading Stylesheet:

#stepper_box {
  position: relative;
  width: 56px;
  background-color: #cccccc;
}

#stepper_box input {
  width: 40px;
  height: 20px;
}

#stepper_box #stepper_down, #stepper_box #stepper_up {
  position: absolute;
  width: 16px;
  height: 9px;
  right: 0px;
}

#stepper_box #stepper_up {
  top: 1px;
}

#stepper_box #stepper_down {
  bottom: 1px;
}

[Guillome]

t Ziet er wel makkelijk uit Dank je voor dit nieuwe inzicht