Kolommen even breed in table

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Jan R

Jan R

31/01/2014 09:45:51
Quote Anchor link
Hi,

Ik heb een tabel met een variable aantal kolommen. Nu wil ik dat elke kolom even breed is.
Ik heb al deze css
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
table-layout: fixed;
width:100%;

Echter als er maar een paar kolommen zijn minder dan 100% dan mogen ze niet alle ruimte in gebruik nemen, maar moeten toch even groot zijn.
Als ik de width:100% weg doe dan zijn niet alle kolommen gelijk en is de ruimte meer dan 100% bij ±5 kolommen of meer

Hoe los ik dit op?

Jan
 
PHP hulp

PHP hulp

19/12/2024 18:08:01
 
Michael -

Michael -

31/01/2014 09:51:39
Quote Anchor link
Meer dan 100%? Ben benieuwd hoe jou table er dan uit ziet.
Als je meerdere kolommen hebt kun je deze natuurlijk niet allemaal 100% geven en dat idee krijg ik nou dat jij dat wel doet.
Je hele table is 100% dus als je 5 kolommen hebt geef je deze alle 5 20%
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
table {table-layout:fixed;witdh:100%;}
th,td {width: 20%;}
 
Jan R

Jan R

31/01/2014 10:12:55
Quote Anchor link
De bedoeling is dus de table max-width=100%
Ik weet wel dat 5X20%=100% maar dat lukt dus niet in css omdat 3 kolommen <100% en 8 kolommen>100% is
Momenteel heb ik 9 kolommen.
Ook met max-width:100% lukt het niet


poging met
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
    table-layout: fixed;
    max-width:100%;
    width:50%;
lukt ook niet. de 50% primeert


Een voorbeeldje :)

Nu ziet het er goed uit maar met weinig kolommen zijn ze te breed. 5=ok, 4 of minder is te breed, 1 is niet om aan te zien
Gewijzigd op 31/01/2014 10:17:43 door Jan R
 
Michael -

Michael -

31/01/2014 10:18:36
Quote Anchor link
Kun je in deze fiddle eens laten zien wat er mis gaat?
edit: update met jou titels. Hier blijft de kolom in zn goede vorm hoor.
Gewijzigd op 31/01/2014 10:27:10 door Michael -
 
Jan R

Jan R

31/01/2014 10:30:33
Quote Anchor link
Hoe moet ik deze updaten?
ik heb deze link terug
http://jsfiddle.net/KdK6L/4/#&togetherjs=P3IiOnwQhi
werkt dit zo?

Toevoeging op 31/01/2014 10:33:43:

Ja maar niet als er minder kolommen zijn.
 
Michael -

Michael -

31/01/2014 10:37:10
Quote Anchor link
Jan R op 31/01/2014 10:30:33:
Hoe moet ik deze updaten?
ik heb deze link terug
http://jsfiddle.net/KdK6L/4/#&togetherjs=P3IiOnwQhi
werkt dit zo?

Toevoeging op 31/01/2014 10:33:43:

Ja maar niet als er minder kolommen zijn.

Ja dat is toch logisch. Dan moet je je afvragen waarom je met % werkt en niet met vaste waardes. Natuurlijk past ie zich aan naarmate je kolommen gaat weg halen en toevoegen.
Geef de table dan geen width en geef de th,td een vaste width van 100px o.i.d.

edit vaste waardes
Gewijzigd op 31/01/2014 10:40:15 door Michael -
 
Jan R

Jan R

31/01/2014 10:40:26
Quote Anchor link
Dan loop ik bij te veel kolommen over 100%. Dit is wat ik ook deed tot nu.
Vermoedelijk wil ik een beetje te veel :)

Toch zeer wel bedankt voor de tussenkomst. Mocht je toch nog ideeën hebben laat maar weten.

Jan
 
Michael -

Michael -

31/01/2014 10:52:33
Quote Anchor link
In de eerste plaats wil je dus dat je kolommen altijd even breed zijn, een vaste waarde dus.
Maar je wil niet dat je hele table buiten beeld komt te vallen?

Wat je nog kan doen; als je met vaste waardes werkt kun je met PHP mee rekenen hoeveel kolommen je hebt. Dan moet je wel van een vaste breedte uitgaan, bijv 900px. Als je kolommen dan 100px zijn tel je het aantal kolommen, meer dan 9 dan wil je een bepaalde actie doen.

Wat die actie is, is me dan nog niet duidelijk, want je wilt je kolommen niet aanpassen (dit doet ie automatisch al)... Dus je zou ze bijv naar onderen kunnen halen.
Gewijzigd op 31/01/2014 10:53:44 door Michael -
 
Obelix Idefix

Obelix Idefix

31/01/2014 11:52:58
Quote Anchor link
Michael - op 31/01/2014 10:52:33:
In de eerste plaats wil je dus dat je kolommen altijd even breed zijn, een vaste waarde dus.

Als ik TS goed begrijp moet elke kolom even breed zijn en die breedte is afhankelijk van het aantal kolommen. Bij 3 kolommen elk 33,3%, bij 5 kolommen elk 20%, etc.
Waar TS, vermoedelijk, tegenaan loopt is het probleem met getallen na de komma.
 
Michael -

Michael -

31/01/2014 12:05:28
Quote Anchor link
Obelix en Idefix op 31/01/2014 11:52:58:
Michael - op 31/01/2014 10:52:33:
In de eerste plaats wil je dus dat je kolommen altijd even breed zijn, een vaste waarde dus.

Als ik TS goed begrijp moet elke kolom even breed zijn en die breedte is afhankelijk van het aantal kolommen. Bij 3 kolommen elk 33,3%, bij 5 kolommen elk 20%, etc.
Waar TS, vermoedelijk, tegenaan loopt is het probleem met getallen na de komma.


TS:
Echter als er maar een paar kolommen zijn minder dan 100% dan mogen ze niet alle ruimte in gebruik nemen, maar moeten toch even groot zijn.
Als ik de width:100% weg doe dan zijn niet alle kolommen gelijk en is de ruimte meer dan 100% bij ±5 kolommen of meer
Gewijzigd op 31/01/2014 12:06:13 door Michael -
 
Jan R

Jan R

31/01/2014 13:22:58
Quote Anchor link
Ik denk dat mijn beste oplossing is van gewoon vaste breedte voor de kolommen

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
table.nextrounds {table-layout:fixed}
table.nextrounds th,table.nextrounds td{border:1px solid #ccc;width:220px;min-width:220px}


Bij weinig kolommen is het dan ok. Bij meer kolommen, wat minder voorkomt, iets minder.

Toch bedankt om mee te denken.

ps: PHP is geen optie. De html komt uit een programma enkel de css js en vbs bestanden zijn aanpasbaar. vbs is ook niet ok want niet ondersteunt door alle browsers.
Jan
Gewijzigd op 31/01/2014 13:26:22 door Jan R
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.