Input Type width 100% in tabel

Status
Niet open voor verdere reacties.
J

JoepdeJong

Gebruiker
Lid geworden
9 nov 2012
Berichten
91
hallo allemaal,
Ik heb een tabel op mijn site met daarin een paar rijen (logisch),
maar nu wil ik onderaan de tabel een rij met een input type, om iets toe te voegen aan het tabel.
De script voor het toevoegen heb ik al,
maar nu wil ik de input type over de breedte van de tabel doen, dus dat hij even breed wordt als het langste stukje tekst dat in de tabel staat,
maar ik weet niet of dit wel ken, en zo ja, hoe?

HTML: 
<html>
<head>
</head>
<body>
<table>
<tr>
<td>De input type moet even lang worden als dit stukje tekst</td>
</tr>
<tr>
<td><Input type="text">
</td>
</tr>
</table>
</body>
</html>
misshien is het een oplossing door er iets met width = 100% te doen, maar ik weet niet hoe...
 
Verander:
HTML: 
<Input type="text">
Naar
HTML: 
<Input style='width:100%;' type="text">

Dat bedoel je toch?
 
Dit gaat goed als de tabel géén opgegeven breedte heeft, en alleen maar die ene kolom heeft:

Heeft de tabel wel een opgegeven breedte, dan gaat het mis en wordt de input over die hele breedte uitgesmeerd:

Heeft de tabel naast de kolom van de tekst en de input één of meer andere kolommen, dan gaat het ook mis:

Ga je de kolom(men) ernaast opduwen door die op maximale breedte te zetten, dan wordt de tekstkolom in elkaar gedrukt:

Om dit te vermijden, moet de tekst boven de input een {white-space: nowrap;} krijgen:

Nu gaat het goed, ook als de bezoeker de lettergrootte wijzigt. :)
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan