div & float:left;

Status
Nicht offen für weitere Antworten.

Pherseus

Erfahrenes Mitglied
Hi. Ich habl folgende Quelltext:

HTML:
 <html>
 <head>
 <style>
 fieldset {
 width:98%;
 margin:5px 0px;
 padding:5px;
 text-align:left;
 border:1px solid #000;
 }
 
 div#left {
 float:left;
 margin-right:20%;
 }
 
 input.text {
 background-color: #F6F6F6;
 width:30%;
 border:1px dashed #000;
 color: #000000;
 font-size: 10;
 font-family: Tahoma,Helvetica,verdana;
 }
 
 #smallfont {
 font-size: 11px;
 font-family: Tahoma,Helvetica,verdana;
 }
 </style>
 </head>
 <body>
   <fieldset class="fieldset">
 	<legend>E-Mail-Adresse</legend>
 	<div id="left">
 	<label for="username">
 	  <p id="smallfont" style="margin-top:0px;"><strong>E-Mail-Adresse</strong></p>
 	</label>
 	<input type="text" name="email" id="email" class="text">
 	</div>
 	
 	<div>
 	<label for="username">
 	 <p id="smallfont"><strong>E-Mail-Adresse</strong></p>
 	</label>
 	<input type="text" name="email" value="" id="email" class="text">
 	</div>
   </fieldset>
 </body>
 </html>

Die beiden Input-Felder sollen genau nebeneinander Angezeigt werden. Allerdings verschiebt sichd das linke ca. eine zeile nach unten. Dies kann ich in der Zeile 37 durch ändern

HTML:
 <p id="smallfont" style="margin-top:0px;"><strong>E-Mail-Adresse</strong></p>
zwar beheben weis aber nicht woran das liegt, dass sich das verschiebt.

Meine Hauptprobleme sind aber, dass erstens das erste Textfeld nicht die gewünschte größe von 30% hat und zweites das ganze in Firefox wunderbar klaptt aber im ie überhaupt ganz komisch formatiert ist.

Angucken kann man das ganze unter http://www.pherseus.net/test.htm

Bin für jede Hilfe dankbar.
 
Also das Problem mit dem IE lässt sich lösen in dem man einfach ins zweite DIV auch ein float:left macht. Dann klappt das. Die falsche Größe lag an den Prozent angaben. Also alles gelöst. :D
 
Status
Nicht offen für weitere Antworten.
Zurück