Toon posts:

[HTML] table met css en colspan doet raar.

Pagina: 1
Acties:

Verwijderd

Topicstarter
Hoi, ik had hier een zeer mooi berichtje, maar mijn pc crashte dus ik probeer het nog een keer overnieuw. :(

Ik heb een table die vaag doet. Hij hoort er zo uit te zien:
code:
1
2
3
4
5
6
7
8
9
10
--------------------
|   top    |
--------------------
|   tussengedeelte |
--------------------
| menu |  main     |
|   |        |
|   |        |
|   |        |
--------------------

In "top" zit nog een table met 3 cellen. De eerste en de laatste cel heb ik met css een vaste breedte gegeven.
De cel "menu" heeft een breedte van 215 pixels. Nu wil het verschijnsel, dat als ik in "main" niets schrijf (of alleen " ") dat het menu breeder wordt, dan zou moeten. En nu komt het vage...

Als ik voor die eerste en laatste cel van die table die zich in de cel "top" bevind een niet zo grote breedte doe, dan heeft "menu" wel de juiste breedte, maar de breedtes die ik wil voor die cellen zorgen ervoor dat als er in de cel "main" geen content is, "main" zeer smal wordt.

Mijn vorige verhaaltje was een stuk vager, en daarom had ik er een link bij geplaatst... dat doe ik nu ook om de boel te verduidelijken.

http://people.zeelandnet.nl/hsteenhart/test.html
http://people.zeelandnet.nl/hsteenhart/test.css (de externe css file)

Als je wilt weten hoe het nu precies zit, moet je deze files es ff offline bekijken en in de css moet je dan de waardes bij
width voor TD.logo en/of die bij TD.topright kleiner maken, bijvoorbeeld, 15 pixels ofzo...

Ik heb het bekeken met Iexplore 6.0 en Opera 6.0 @ een resolutie van 1024 x 768...

In de files kun je nog verdere info aantreffen...

Voor onduidelijkheden, of andere vragen... stel ze gerust, het is misschien niet gelijk duidelijk...

Alvast bedankt :)

p.s.: Ik heb de codes zo veel mogelijk versimpeld, zodat het sneller duidelijk is... volgens mij heeft dit verder geen invloed op het probleem.

//edit: wat ik was vergeten te melden, de table heeft een width en height van 100%

  • cutter
  • Registratie: November 2000
  • Laatst online: 28-09-2025

cutter

Wannabe i7 fanboy

Cellen houden niet zo graag van breedtes en hoogtes. Waarom zet je niet 3 tabellen onder elkaar. Dus top in 1table tussengedeelte in 1 table en menu/main in 1 table.

En ik zou het hele gebeuren ontwerpen voor een standaard breedte van 740 (is voor 800x600 reso) zodat op alle monitoren de site goed naar voren komt. Op mijn 19" 1600x1200 beamer komen aan de reso aanpassende sites niet zo mooi over.

Als je een cel een harde breedte mee wil geven kun je een spacer image gebruiken. In dreamweaver 4 kun je daar meer over vinden. Of hiero http://www.bravenet.com/reviews/archives/tips.php?view=31
of
http://www.pageresource.com/html/table4.htm

Verwijderd

Topicstarter
Bedankt cutter... met die 3 tables is het gelukt. Alleen zou ik graag willen dat de laatste table zo'n height heeft, dat het scherm altijd gevuld is.
code:
1
2
3
4
5
6
7
8
9
10
<table border="1" cellspacing="0" cellpadding="5" width="100%" height="75">
<!-- bla bla... wat tr's en td's -->
</table>
<table border="1" cellspacing="0" cellpadding="5" width="100%" height="29">
<!-- nog meer tr's en td's -->
</table>

<table border="1" cellspacing="0" cellpadding="5" width="100%" height="?????????">
<!-- nog meer tr's en td's -->
</table>

Wat moet ik bij die laatste table bij height invullen??

Ik heb al met javascript geprobeerd om iets voor elkaar te krijgen, maar ik ben niet zo'n javascripth-held.

iets als
code:
1
document.write(screen.availHeight-104);

heb ik geprobeerd, maar ik weet niet precies hoe ik dit in die table attribute krijg...

Dus vraag ik of iemand asjeblief de precieze code kan geven daarvoor... ik ben je erg dankbaar...

(nee, ik kon het niet zo vinden... ik heb gezocht)

Verwijderd

Hoi,

als je nou bij de tag table aangeeft "height=100%" en bij de rij die de rest van de pagina moet vullen (de laatste tr tag dus) "height=*" dan lijkt me dat het moet werken.
De hele tabel is dan 100% hoog (beeldvullend dus) en de laatste rij (de laagste) is even hoog als het deel van het beeld dat over is, hoog is.

Om een nog mooier effect te krijgen moet je alle margins (topmargin, leftmargin, rightmargin en bottommargin) van de body tag op nul zetten. Door dan ook nog de cellspacing van de tabel op 0 te zetten zorg je er helemaal voor dat de tabel tot helemaal onderaan doorloopt. :D

Ronald.

  • Dennis
  • Registratie: Februari 2001
  • Laatst online: 23:41
Op zaterdag 26 januari 2002 21:09 schreef Breakout het volgende:
Hoi,

als je nou bij de tag table aangeeft "height=100%" en bij de rij die de rest van de pagina moet vullen (de laatste tr tag dus) "height=*" dan lijkt me dat het moet werken.
De hele tabel is dan 100% hoog (beeldvullend dus) en de laatste rij (de laagste) is even hoog als het deel van het beeld dat over is, hoog is.
En dat werkt ook lekker goed in alle browsers |:(

Verwijderd

Topicstarter
height="*"
hehe, grappig... maar dat heb ik alleen nog nooit gezien :+

Maar wat ik nu dus graag wil weten is...

Ik heb 3 tables onder elkaar, de bovenste 2 met een vaste hoogte, de onderste moet de rest van het scherm vullen als er niet genoeg content is om dat te doen...
Wat ik me dus af vraag is of dat met javascript te doen is.
Als eerste, hoe ik dat in de height attribute krijg,
en, of er ook een javascript functie is die de beschikbare hoogte van het browserwindow geeft, want screen.availHeight geeft gewoon je resolutiehoogte min de hoogte van je taakbalk. Maar de statusbar, adresbar, etc. zitten daar dus niet bij...

Verwijderd

hehe, grappig... maar dat heb ik alleen nog nooit gezien :+
Dat je iets nog nooit gezien hebt, hoeft nog niet te betekenen dat het dan niet bestaat.

height=* of height="*" bestaat wel degelijk en het werkt nog goed ook. En waarom zou je Javascript gebruiken wanneer er ook een simpele oplossing is.

Je moet dan gewoon van de drie afzonderlijke tabellen, een grote tabel maken (had je eerst ook maar werd toen weer afgeraden). Dan kun je de bovenste tabel in de nu dus zien als de wat er tussen de eerst tr tag van de grote tabel staat. De tweede tabel wordt dan wat tussen de tweede tr tag staat, etc.

Nu geef je bij de eerste en tweede tr tag de hoogte op die je wilt hebben (vaste hoogte dus) en bij de derde tr tag zet je neer heigth=*

Als je de andere de andere adviezen opvolgt, uit mijn vorige post, dan werkt het prima.

Ronald.
Pagina: 1