Tabeluitlijning niet correct

[anoniem]

Ik heb op een [url=http://home.wanadoo.nl/tv-apollo/Historie.html]pagina op mijn site[/url] een overzicht met de wijzigingen die zijn aangebracht. Ik heb dit in een table geplaatst met 2 kolommen, links de datum, rechts tekst. De rechter kolom wordt nu steeds uiterst rechts op de pagina geplaatst, waardoor in het midden een groot leeg vlak ontstaat (zie link). Bij de table definitie heb ik de volgende regels opgenomen in de html: [code:1:c99086d737]<table style="table-layout: fixed; width=90% border=0 summary="""> <col style="width=15%"> <col style="width=85%">[/code:1:c99086d737] Mijn bedoeling is een tabel te krijgen die iets minder breed is dan de pagina, vandaar de width=90%. Hoe krijg ik nu voor elkaar dat ik het lege vlak in het midden kwijt ben? In de CSS staat volgens mij niets dat hierop van invloed is: [code:1:c99086d737]table {background-color: white; color: navy; font-family: verdana,arial,sans-serif; font-size: 8pt; font-style: normal;} th {background-color: white; color: navy; font-family: verdana,arial,sans-serif; font-size: 12pt; font-style: normal; font-weight: bold; text-align: left;} td.klein {background-color: white; color: navy; font-family: verdana,arial,sans-serif; font-size: 80%;} [/code:1:c99086d737] Heeft iemand suggesties?

[anoniem]

Een paar suggesties: [quote:91a4fefa5e="Dick Bierman"]Bij de table definitie heb ik de volgende regels opgenomen in de html: [code:1:91a4fefa5e]<table style="table-layout: fixed; width=90% border=0 summary="""> <col style="width=15%"> <col style="width=85%">[/code:1:91a4fefa5e] [/quote:91a4fefa5e] Verander dit eens in: [code:1:91a4fefa5e]<table style="table-layout: fixed;" width="90%" border="0" summary="">[/code:1:91a4fefa5e] en geef de eerste <td> tag de gewenste breedte mee: [code:1:91a4fefa5e] <tr valign="top"> <td width="15%">03-09-2004</td> <td>De <a href=" [/code:1:91a4fefa5e] [quote:91a4fefa5e] Hoe krijg ik nu voor elkaar dat ik het lege vlak in het midden kwijt ben? <KNIP> Heeft iemand suggesties?[/quote:91a4fefa5e] Het witte vlak verschijnt omdat je kolommen ieder gewoon de helft van de tabel breedte krijgen. Voor zover ik kan zien doen die <col> tags niks voor je kolombreedte. Maar ik kan me vergissen. Als je bovenstaande aanpassingen doet, zou het goed moeten gaan.

[anoniem]

Dat van die col-tags heb ik ergens gelezen, dat daarmee de html op voorhand 'weet' hoe breed de kolommen moeten worden, en daarmee de pagina sneller geladen wordt. Blijkbaar werkt dit dus niet goed (of ik heb het verkeerd overgenomen...). Ik ga later, thuis, proberen of quotjes zetten in de table-definitie helpt. Als ik nu probeer wat voor effect de verschillen in de table-definitie voor resultaten oplevert, dan zie ik geen verschil (tabel ziet er gewoon uit zoals bedoeld is, dus zonder witte ruimte in het midden). Ik snap het niet meer, *zucht*... Als ik iets beter kijk, dan lijkt het nu ook alsof de tabel wel de hele paginabreedte in beslag neemt, dus die width=90% doet ook niets...

[anoniem]

Wat er sowieso fout gaat is de style definitie in de <table> tag. [code:1:677a716096]<table style="table-layout: fixed; width=90% border=0 summary="""> [/code:1:677a716096] Er staan hier css-code gemixed met html-opmaak code. Zo te zien had je achter "table-layout: fixed;" al een " moeten plaatsen. Als ik je code bekijk, zie ik trouwens dat je dat vrij consequent volhoudt :wink: . Als je dat nou oplost/aanpast, dan kom je een heel eind in de goede richting, vermoed ik. Ik heb ook nog even gekeken wat <col> doet, en het klopt dat je daarmee eigenschappen van de kolom kunt bepalen. Dat moet je dan niet doen met css-tags (style="width: 10;"), maar met gewone html (<col width="10">). Kijk [url=http://www.dynamicdeezign.com/cursushtml/les7.html]hier[/url] ook eens.

[anoniem]

Aha! Zinvolle site, weer wat van opgestoken :-) Ik heb de betreffende pagina gewijzigd (de rest komt later wel), en het werkt nu echt zoals bedoeld! Dank voor je hulp. De html ziet er nu zo uit: [code:1:9c1fe4d636]<table style="table-layout: fixed;"> <table width=90% border=0 summary=""> <col width=15%> <col width=85%> <tr valign="top"> <td>10-09-2004</td> <td>De na[/code:1:9c1fe4d636] Ik weet niet of de eerste 2 regels nu echt 'netjes' zijn, maar het werkt wel in ieder geval.

[anoniem]

zet ook nog in de body wat voor een achtergrondkleur je wilt. Ik zie nu nl. grijs :) [code:1:6d21ecc3cf] body { background-color: #FFF; }[/code:1:6d21ecc3cf]

[anoniem]

[quote:1a6d39c599]Ik weet niet of de eerste 2 regels nu echt 'netjes' zijn, maar het werkt wel in ieder geval.[/quote:1a6d39c599] Nee (uiteraard) is dat niet netjes en ook overbodig.. meneer_ed geeft al precies aan wat er verkeerd was, waarom het niet werkte en waar je nog op moet letten bij het maken van pagina's m.b.v. css. Het is ook <col width="15%"> en niet <col width=15%>.

[anoniem]

[quote:75a779eb0b="maIRnaairruJ"] Het is ook <col width="15%"> en niet <col width=15%>.[/quote:75a779eb0b]Bij een héééééle oude HTML-specificatie denk et niet :P [quote:75a779eb0b]Ik weet niet of de eerste 2 regels nu echt 'netjes' zijn, maar het werkt wel in ieder geval.[/quote:75a779eb0b]Niet een echte goede instelling. (understeatment)

[anoniem]

[quote:1465f6d341="Johnny321"][quote:1465f6d341="maIRnaairruJ"] Het is ook <col width="15%"> en niet <col width=15%>.[/quote:1465f6d341]Bij een héééééle oude HTML-specificatie denk et niet :P[/quote:1465f6d341][/quote]Ook bij nieuwe HTML specificaties zal het correct zijn (en bij de laatste). Je kan alleen beter CSS gebruiken in plaats van het WIDTH attribuut.

[anoniem]

Dank voor jullie aanvullingen! Ik heb weer wat gewijzigd en hoop dat het nu beter is. [code:1:d740a652a9]<table class="historie"> <col width="15%"> <col width="85%"> <tr class="historie"> <td class="historie">10-[/code:1:d740a652a9] Dit heb ik nu in de html staan, en in de css definieer ik e.e.a. voor table, tr, en td. Dit is volgens mij wat jullie bedoelen met de scheiding tussen html en css, toch? @ Anne: ik snap nog niet hoe ik de kolombreedte in css kan oplossen. In ieder geval geeft mijn editor (Acehtml) niet de mogelijkheid om bij de html-tags table, td of tr iets wat duidt op een kolombreedte te kiezen en daar dan wat mee doen. Kun je een tipje van de sluier voor me oplichten hoe ik dit in css moet oplossen?

[anoniem]

[code:1:089c70f8aa]<table class="historie"> <col class="kolom1"> <col class="kolom2"> <tr class="historie"> <td class="historie">10-</td>[/code:1:089c70f8aa] in je CSS [code:1:089c70f8aa] .kolom1 { width: 15%; } .kolom2 { width: 85%; } [/code:1:089c70f8aa] succes