Homepage selbermachen 7.851 Themen, 35.615 Beiträge

Hässlicher 1px rand im IE

Yves3 / 4 Antworten / Flachansicht Nickles

Hallo,

Ich habe wieder mal ein lästiges Problem mit dem IE.
Am besten posten ich ein Beispiel:



Code:

<form name="form1">
<div style="
vertical-align: bottom;
background-color: #5677bb;
width: 15%;
padding: 0px;
text-align: center;
font-weight: bold;
color: white;
float:left;">Beispiel
<br />
<div style="
border-style: solid;
border-color: #666666;
border-width:1px;"
>
<input type="text" name="txtUserid" style=" width:100%;
padding: 0px;
margin:0px;
border-width: 0px;
background-color: #FFFFFF;"/>
</div>
</div>
</form>


Hier ist im IE unter der Inputbox noch ein 1px breiter und sehr hässlicher Rand. Ich habe jetzt schon einiges ausprobiert und kann mir einfach nicht erklären woher der kommt oder wie ich ihn weg kriege.

Wäre wirklich sehr dankbar, wenn mir da jemand helfen könnte.
bei Antwort benachrichtigen
Yves3 Borlander „Einfach durch durch ihre Entitäten lt und gt ersetzen...“
Optionen

EDIT: --> Scheint noch nicht so ganz zu klappen... editiere es dann wieder hier rein, wenn es tatsächlich funktioniert.
EDIT2: --> So, das sollte jetzt die finale und endlich funktionierende Version sein. Ich musste das Padding noch dem div zuweisen. (Welcher Vollidiot kam auf die Idee, das Boxmodell so zu entwerfen, wie es ist?). Naja, mit ein paar Hacks geht alles...irgendwann.

Vielen Dank! Ich habe das jetzt noch ein kleines Bisschen umgeschrieben, damit es sich in den Rest auch gut integrieren lässt.




<form name="form1">
<div style="width: 15%; float: left;">
<h3 style="vertical-align: bottom;
background-color: #5677bb;
margin: 0px;
text-align: center;
font-family: Arial, Verdana, Sans Serif;
font-weight: bold;
color: white;
">Beispiel</h3>
<div style="border-style: solid;
border-color: #666666;
border-width:1px;
padding: 0px;
margin: 0px;
padding-left: 4px;
padding-right: 4px;">
<input type="text" name="txtUserid"
style="width:100%;
margin:0px;
border-width: 0px;
background-color: #FFFFFF;"/>
</div>
</div>
</form>


Was das Posten von Code betriff:
Ich verwende zusätzlich noch das <pre>-Tag, damit die Formatierung erhalten bleibt. Leider fügt die Forensoftware überall noch einen zusätzlichen Zeilenumbruch ein. Wie man das umgehen kann, das habe ich noch nicht herausgefunden.
bei Antwort benachrichtigen