nicht angemeldet
Problem bei Platzierung von <input type="image> und Scrollbalken
Liebe Leute!
Wie schon im Betreff beschrieben habe ich einige Probleme, was die Positionierung von Bilder-Buttons angeht.
Der Bild-Button sieht momentan so aus:
<div style = "max-height: 500px; overflow: auto">
<table>
<tr>
<td width="100">...</td>
<td width="...">...</td>
<td>
<form ... >
<input type="hidden" ... >
<input type="image" name="button_edit" src="data/b_edit.png">
<input type="image" name="button_delete" src="data/b_drop.png">
</form>
</td>
</tr>
...
</table>
</div>
Es fängt damit an, dass der Bild-Button mehr Platz braucht als das Bild, wenn es kein Button ist, und das obwohl das Bild keinen ersichtlichen Rahmen oder Button-Effekt hat, was zusätzlichen Platzbedarf rechtfertigen würde. Setze ich den Bild-Button in eine Tabelle, so wird automatisch die betreffende Zeile ein wenig höher als wenn das Bild kein Button wäre, und der Bild-Button klebt dann am oberen Zellenrand mit etwa 5 Pixeln Abstand nach unten, und zwar unabhängig davon, welche Werte bei VALIGN angegeben werden.
Ein weiteres Problem tritt auf, wenn die Tabelle in einem <div style="max-height: 500 px; overflow: auto"> Element steht. Sobald die Tabelle größer wird, und der Scrollbalken erscheint, wird der dafür nötige Platz von der Breite des Tabellenfelds mit den Bild-Buttons abgezogen. Die Bild-Buttons sind nun untereinander statt nebeneinander, und die Tabellenzeile wird noch höher als zuvor. Wenn ich nun der Tabellenzeile mit den Bild-Buttons eine fixe Breite zuweise, passiert etwas noch merkwürdigeres: Als ob die Tabelle zu breit wäre wird nun jedes Tabellenfeld verkleinert, sodass der Scrollbalken trotzdem noch Platz wegnimmt und die Breiten der Tabellenspalten nicht mehr mit der darüber liegenden Tabelle übereinstimmen. Eigentlich wäre das aber sowieso unnötig, da ich nach rechts genügend Platz für den Scrollbalken habe und das HTML ja das Tabellenfeld mit den Bild-Buttons beliebig vergrößern könnte. Ich habe bereits versucht, width="100%" in das <table> Element zu schreiben, das kümmert die Browser aber gar nicht, sie erfinden lieber ein Platzproblem, wo keines ist.
Mir ist schon klar, dass bei meiner Methode der Scrollbalken immer innerhalb des begrenzten Elements liegt. Es ist aber trotzdem nicht nötig das letzte Tabellenfeld noch weiter zu verschmälern. Stattdessen sollte der Browser erkennen, dass die Breite dieses letzten Tabellenfelds frei wählbar ist und sich daher der Scrollbalken neben den Bild-Buttons locker ausgeht.
Wie kann ich dieses Problem am besten Lösen?
Vielen Dank für eure Antworten!
P.S.: Ich hoffe die Beschreibung des Problems war nachvollziehbar, sollte das nicht der Fall sein bitte ich um kurze Rückmeldung, dann kann ich Screenshots hochladen.
-
Ich habe das Problem gelöst, indem ich dem div-Element eine fixe Breite zugeordnet habe. Das ist zwar nicht unbedingt die schönste Lösung, funktioniert aber.