Witam.
Zrzuty ekranu:
- Mozilla Firefox
- Internet Explorer
Legenda IE SS:
1) Co jest grane dlaczego dwa inputy znikają ?
2) Pewnie to specyfika IE ale chciałbym jakoś uzyskać pełną ramkę,
- a jeśli to nie jest możliwe jak ustawić żeby w IE nie wyświetlała się też ramka dolna a w pozostałych żeby wyświetlała się cała ramka.
3) Chciałbym aby obie kolumny miała taką samą wysokość zależna rzecz jasna od zawartości lewej kolumny.
CSS:

[HTML] pobierz, plaintext 
<style>
div.registration { width:100%; margin:10px 0 10px 0; padding:0; }
div.registration-left { float:left; width:47%; margin:0 1% 0 2%; padding:0; }
div.registration-right { float:left; width:47%; margin:0 2% 0 1%; padding:0; }
 
div.registration fieldset { width:96%; padding:7px 2% 7px 2%; margin:0 0 5px 0; }
div.registration legend { font-size:12px; font-weight:bold; }
div.registration fieldset label { float:left; margin:0 0 5px 0; font-size:11px; text-align:left; overflow:hidden; text-align:justify; }
div.registration fieldset.row label { width:100%; }
div.registration fieldset.col label { width:50%; }
div.registration fieldset label span { float:left; line-height:17px; }
div.registration fieldset label input { float:left; width:95%; height:15px; font-size:12px; line-height:9px; background:none; }
div.registration fieldset label input.username { width:98%; }
div.registration fieldset label.chbx { cursor:pointer; }
div.registration fieldset label.chbx input { float:left; width:14px; margin:0 3px 0 3px; padding:0; }
div.registration fieldset label.select { float:left; width:100%; }
div.registration fieldset label.select select { float:left; width:100%; background:none; }
div.registration fieldset.regulations_content div { width:100%; height:356px; margin:0 0 10px 0; overflow:scroll; background:none; border:1px solid #000; }
div.registration fieldset.regulations_content label { font-weight:bold; }
 
div.registration input.btn_submit { float:none; width:90%; height:21px; margin:0 auto; margin-top:10px; font-size:12px; line-height:12px; background:none; }
</style>
[HTML] pobierz, plaintext 

HTML:

[HTML] pobierz, plaintext 
<div class="registration">
	<form method="post" action="#">
		<div class="registration-left">
			<fieldset class="row">
				<legend>User name:</legend>
				<label>Enter user login</label>
				<label><input class="username" type="text" name="username" value="" /></label>
			</fieldset>
			<fieldset class="col">
				<legend>Password:</legend>
				<label>Enter password</label>
				<label>Retype password</label>
				<label><input type="password" name="password1" /></label>
				<label><input type="password" name="password2" /></label>
			</fieldset>
			<fieldset class="col">
				<legend>Email address:</legend>
				<label>Enter email address</label>
				<label>Confirm email address</label>
				<label><input type="text" name="email" value="" /></label>
				<label><input type="text" name="emai2" value="" /></label>
			</fieldset>
			<fieldset class="row">
				<legend>Receive e-mails from:</legend>
				<label>Admins and users may want to contact you via e-mail sometime.</label>
				<label class="chbx"><input type="checkbox" name="emails_admin" checked> Receive e-mails from admins</label>
				<label class="chbx"><input type="checkbox" name="emails_users" checked> Receive e-mails from other users</label>
			</fieldset>
			<fieldset class="row">
				<legend>Timezone:</legend>
				<label class="select">Below you can adjust timezone settings</label>
				<label class="select"><select></select></label>
			</fieldset>
		</div>
		<div class="registration-right">
			<fieldset class="regulations_content">
				<legend>Regulations</legend>
				<label><div></div></label>
				<label class="chbx"><input type="checkbox" name="regulation"> I've read and i agree with terms and rules</label>
			</fieldset>
		</div>
		<input class="btn_submit" type="submit" value="Register">
	</form>
</div>
[HTML] pobierz, plaintext 

W IE się coś inaczej liczy i jesli wyjdziesz poza width elementem a masz na nim overflow:hidden to ci go ukryje
zmniejsz szerokość tych 2 inputów i zobacz czy sie pojawią

są jakies metody do nadpisywania *.css tylko dla IE7 dajac mu poprawne dane zrob sobie dodatkowy plik i poszukaj na googlach

<!--[if IE 7]>

<link rel="stylesheet" type="text/css" href="iehacks-7.css" />

<![endif]-->

IE jeśli nie masz Strict (czy jakoś tak - nie pamiętam jak to było) używa innego box model, dlatego źle traktuje padding, margin, width, height. Proponowałbym conditional comments (tak jak kolega powyżej zaproponował - <!--[if IE]> ... <![endif]-->).

zajżyj TUTAJ a doznasz oświecenia, że jest IE6 ... długo, długo nic ... potem IE7, długo, długo nic a dopiero na końcu normalne przeglądarki które wyświetlają XHTML + CSS zgrubsza zgodnie ze standardami.

kolego radex_p - a zajrzałeś w ogóle pod link który podałem? tam są właśnie podane błędy oraz różnice w interpretacji CSS dla większości przeglądarek, wraz ze sposobami naprawy lub obejścia problemów....