ďťż

[CSS] Mozilla Firefox i Internet Explorer Z ciekawości który poprawnie wyświetla....

Strona początkowa
 
JavaScript
 
Max dla RAM
 
Quick Time
 
phpBB skins

Podstrony

telcocafe

Cześć.
Chciałem zrobić strone w 100 % na DIVach, ale InternetExplorer mi to uniemożliwia.
Zastanawiam się czy popełniłem jakiś błąd pisząc kod, czy to tylko znowu ta syfiasta aplikacja ( IE ).

Screen'y:
InternetExplorer Screen Link
Mozilla Firefox Screen Link

CSS:
input#text { height:14px; text-align:center; border-color:#444444; border-style:solid; background:none; color:#CCCCCC; font-size:12px; } #txtHeadName { width:100%; color:#CCCCCC; font-size:12px; text-align:center; border-bottom:1px black solid; } #margin_top5 { margin-top:5px; } #table_row { width:100%; text-align:left; display:table-row; vertical-align:middle; } #table_cell_left120,#table_cell_left25 { display:table-cell; vertical-align:middle; color:#CCCCCC; background:none; font-size:12px; text-align:left; } #table_cell_left120 { width:120px; } #table_cell_left25 { width:25px; } #table_cell_right { display:table-cell; vertical-align: middle; }

HTML:
<div style="width:345px; float:right; margin-right:10px; display:table;"> <div id="txtHeadName"><b>{EmailChange}:</b></div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{OldEmail}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="text" id="text" name="staryEmail"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewEmail}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="text" id="text" name="nowyEmail"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewEmail} ({Repeat})</div> <div id="table_cell_right"><input style="margin-left:10px;" type="text" id="text" name="nowyEmail2"></div> </div> </div> <div id="txtHeadName"><b>{PassChange}</b></div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{OldPass}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="password" id="text" name="stareHaslo"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewPass}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="password" id="text" name="noweHaslo"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewPass} ({Repeat})</div> <div id="table_cell_right"><input style="margin-left:10px;" type="password" id="text" name="noweHaslo2"></div> </div> </div> <div id="txtHeadName"><b>{Settings}:</b></div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left25"><input type="checkbox" name="biuletyn" {BulletinCheck}></div> <div id="table_cell_right">{BulletinInfo}</div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left25"><input type="checkbox" name="emailPokazuj" {ShowEmailCheck}></div> <div id="table_cell_right">{DEIP}</div> </div> </div> </div>

Edit >
Da się jakoś zrobić tutaj żeby kod wyświetlał się w <IFRAME> i żeby się nie rozsypywał ( łamał na końcu lini ) ?
Użytkownik orglee edytował ten post 27 sierpień 2006, 00:52

jedyne rozwiązanie na jakie teraz wpadam jest troche nieładne, ale na 99% zadziała. Ten kod css który dałeś proponuje ci zapisać troche inaczej. Skopiuj go i przed każdą z lini dopisz html>body kod_css
IE nie będzie czytało tego kodu, a przeglądarki z silnikami Geko jak FF będą to czytały odpowiednio
Następnie pierwszą wersje kodu przerób tak żeby pod IE wyglądało tak jak chcesz. W ten sposób będziesz miał 2 różniące się kody, ale ten bez dodatkowej formuły html>body będzie interpretowany tylko przez IE, a pozostałe przeglądarki będą interpretowały ten drugi kod.


HTML:
<div style="width:345px; float:right; margin-right:10px; display:table;"> <div id="txtHeadName"><b>{EmailChange}:</b></div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{OldEmail}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="text" id="text" name="staryEmail"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewEmail}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="text" id="text" name="nowyEmail"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewEmail} ({Repeat})</div> <div id="table_cell_right"><input style="margin-left:10px;" type="text" id="text" name="nowyEmail2"></div> </div> </div> <div id="txtHeadName"><b>{PassChange}</b></div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{OldPass}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="password" id="text" name="stareHaslo"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewPass}</div> <div id="table_cell_right"><input style="margin-left:10px;" type="password" id="text" name="noweHaslo"></div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left120">{NewPass} ({Repeat})</div> <div id="table_cell_right"><input style="margin-left:10px;" type="password" id="text" name="noweHaslo2"></div> </div> </div> <div id="txtHeadName"><b>{Settings}:</b></div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left25"><input type="checkbox" name="biuletyn" {BulletinCheck}></div> <div id="table_cell_right">{BulletinInfo}</div> </div> </div> <div id="margin_top5"> <div id="table_row"> <div id="table_cell_left25"><input type="checkbox" name="emailPokazuj" {ShowEmailCheck}></div> <div id="table_cell_right">{DEIP}</div> </div> </div> </div>

Edit >
Da się jakoś zrobić tutaj żeby kod wyświetlał się w <IFRAME> i żeby się nie rozsypywał ( łamał na końcu lini ) ?

Pisanie na divach w ten sposób jest bez sensu. Zauważ ile masz kodu - więcej niż jakbyś użył tabelki!!! A schemat dokładnie taki sam.
Użytkownik .:dR@kE:. edytował ten post 27 sierpień 2006, 08:27
  • zanotowane.pl
  • doc.pisz.pl
  • pdf.pisz.pl
  • nvm.keep.pl
    		•
    Sitedesign by AltusUmbrae.