Hilfe bei HTML Problem

Seite 1 von 1 - Forum: Coding Stuff auf overclockers.at

URL: https://www.overclockers.at/coding-stuff/hilfe_bei_html_problem_77161/page_1 - zur Vollversion wechseln!

Yeahman schrieb am 02.05.2003 um 14:03

Kann mir jemand sagen wie ich bei folgendem Sample den Rahmen an ans Input Field, und ans Bild anpassen kann, also wie ich die weisse Pixelreihe oben und unten weg krieg?

<nobr><div style="border-style: inset; border-width: 2px;"><input type="Text" style="border-style: none; margin: 0px;" /><img src="DropDown.bmp" style="margin: 0px; vertical-align:middle;" hspace="0" vspace="0"></div><nobr>

Ich habs auch mir einem Table probiert:
<table cellspacing="0" cellpadding="0" style="border-style: inset; border-width: 2px; white-space: nowrap; overflow: hidden;"><tr><td><input type="Text" style="border-style: none; margin: 0px;" /></td><td><img src="DropDown.bmp" style="float: right;" hspace="0" vspace="0"></td></tr></table>

/Edit: hab das Bild nur auf gif umbenannt, ist aber ein bmp, aber sonst hätt ichs nicht uploaden können.

that schrieb am 02.05.2003 um 18:19

Ich hab das ganze nachgebaut, und außer dass das input länger war als der Rahmen, ist mir nichts Besonderes aufgefallen. Nachdem ich dem input ein "width:85px" spendiert habe, schaut das Ding ziemlich genau so aus wie eine ganz normale Combobox (Mozilla 1.3, Linux).

btw, gute Idee.

Yeahman schrieb am 02.05.2003 um 19:29

Vielleicht bin ich unfähig aber irgentwie ändert das nix bei mir, der eine Pixel abstand und oben vom Image ist immer noch da.

Hab den Source editiert, der Div sollte gar keine Breite haben.

atrox schrieb am 02.05.2003 um 21:45

btw.. das hat gute gründe, warum man kein .bmp verwenden sollte.. aber mit folgendem code gehts bei mir im IE ohne helle streifen oben und unten:

Code:

 <table cellspacing="0" cellpadding="0" style="border-style: inset; border-width: 2px; white-space: nowrap; overflow: hidden;">
 <tr><td><input type="Text" style="border-style: none; margin: 0px; [b]padding: 0px;[/b] " /></td><td><img src="oc_dropdown.bmp" 
 style="float: right;" hspace="0" vspace="0" height=18 width=16 ></td>
 </tr></table>

sicherheitshalber kannst noch nach dem `padding´ ein `height´ einfügen, um die größe auch bei unterschiedlichen schriftarten zu beschränken. (und evt. auch die schriftart festlegen)

btw... plain HTML is a dangerous language

watchout schrieb am 02.05.2003 um 21:58

@atrox: bei mir aba net , ich arbeite daran... finds lustig dass es so net funkt...
edit: padding is der _innen_abstand, was nutzts dir, wenn du den innenabstand vom input zum text darin veränderst?

Yeahman schrieb am 02.05.2003 um 22:11

bei mir ändert sich auch nix. Mit Padding und Height. Ich hab nachwievor 1 Pixel oben und unten Abstand.

watchout schrieb am 02.05.2003 um 22:15

versuch mal

Code:

<br />
<span style="font-size:1px; border-style: inset; border-width: 2px; margin: 0px; line-height:18; padding:0px; overflow:hidden; vertical-align:middle;">
	<input type="Text" style="border-style: none; margin: 0px; height: 18px; overflow: hidden; vertical-align:middle;" />
	<img src="DropDown.bmp" style="margin: 0px; vertical-align:middle;" hspace="0" vspace="0">
</span>
<br />

UND FRAG MICH NICHT WARUM!!!

Yeahman schrieb am 02.05.2003 um 22:18

jetzt bin ich einen Schritt weiter weil, jetzt ist der eine Pixel rechts vom Img , aber das werd ich schon hinkriegen, thx.

atrox schrieb am 02.05.2003 um 22:24

warum innenabstand? weil die meisten IE versionen das padding schlichtweg falsch berechnen. ich habs vorerst nur in IE5 getestet gehabt, da reicht das padding.

gibt man zusätzlich `height:16 px´ an, gehts sowohl in IE5 als auch IE55.

Yeahman schrieb am 02.05.2003 um 22:33

jetzt funktionierts :confused: , ich bin mir eigentlich ziemlich sicher es vorher versucht zu haben mit height, aber gut.
Wens interessiert so funktionierts (bei mir IE6):
<table cellspacing="0" cellpadding="0" style="border-style: inset; border-width: 2px; white-space: nowrap; overflow: hidden;">
<tr><td><input type="Text" style="border-style: none; margin: 0px; padding: 0px; height: 16px;" /></td><td><img src="dropdown.bmp"
style="float: right;" hspace="0" vspace="0"></td>
</tr></table>

watchout schrieb am 02.05.2003 um 23:10

Zitat von Yeahman
jetzt funktionierts , ich bin mir eigentlich ziemlich sicher es vorher versucht zu haben mit height, aber gut.
Wens interessiert so funktionierts (bei mir IE6):
<table cellspacing="0" cellpadding="0" style="border-style: inset; border-width: 2px; white-space: nowrap; overflow: hidden;">
<tr><td><input type="Text" style="border-style: none; margin: 0px; padding: 0px; height: 16px;" /></td><td><img src="dropdown.bmp"
style="float: right;" hspace="0" vspace="0"></td>
</tr></table>

wenn du bei meinem die tabs rausnimmst passts auch