Please HELP ! - Socoder

-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0\|36\|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
Socoder -> Web Development -> Please HELP !
Thu, 01 Apr 2010, 19:01
steve_ancell	I've been having another crack at learning how to make a website. The document below works OK in FireFox but a bit dodgy in Internet Explorer. If I uncomment the DTD however, it bloomin' well wont work at all. Any ideas ? <!-- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd"> --> <html> <head> <title>Div</title> <style type="text/css"> #main { margin: auto; width: 50%; height: 50%; background-color: black; border-width: 8px; border-color: blue; border-style: solid; } #nest1 { width: 100%; height: 25%; background-color: red; } #nest2 { width: 100%; height: 25%; background-color: grey; } #nest3 { width: 50%; height: 25%; float: right; background-color: purple; } #nest4 { width: 50%; height: 25%; background-color: orange; } #nest5 { width: 100%; height: 25%; background-color: grey; } </style> </head> <body> <div id="main"> <div id="nest1"> </div> <div id="nest2"> </div> <div id="nest3"> </div> <div id="nest4"> </div> <div id="nest5"> </div> </div> </body> </html> --v
Thu, 01 Apr 2010, 19:16
HoboBen	Internet explorer wants "gray", not "grey". In strict mode, empty div elements are considered not to exist - either add text to them or use (ampersand)nbsp; (non-breaking space) if you want them to look empty without being empty. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Div</title> <style type="text/css"> #main { margin: auto; width: 50%; height: 50%; background-color: black; border-width: 8px; border-color: blue; border-style: solid; } #nest1 { width: 100%; height: 25%; background-color: red; } #nest2 { width: 100%; height: 25%; background-color: gray; } #nest3 { width: 50%; height: 25%; float: right; background-color: purple; } #nest4 { width: 50%; height: 25%; background-color: orange; } #nest5 { width: 100%; height: 25%; background-color: gray; } </style> </head> <body> <div id="main"> <div id="nest1"> 1 </div> <div id="nest2"> 2 </div> <div id="nest3"> 3 </div> <div id="nest4"> 4 </div> <div id="nest5"> 5 </div> </div> </body> </html> --v -=-=- blog \| work \| code \| more code
Thu, 01 Apr 2010, 19:24
steve_ancell	OK thanx Ben, I'll go and try that now
Thu, 01 Apr 2010, 19:43
steve_ancell	That sort of helped, but the divisions are only one text line high. The percentage values do what they say on the tin when there's no DTD. I'm not too sure if I should be using percentages for the height of the divisions !
Thu, 01 Apr 2010, 20:01
steve_ancell	I was also having a play around with AJAX. What is weird though, it works OK straight from my HDD in FireFox but not in Internet Explorer. But it works fine in Internet Explorer if I upload it to some webspace first Here are the files... AJAX Practice
Thu, 01 Apr 2010, 20:14
Stealth	The doctype switches IE in to standards rendering mode. Without it, IE uses quirks rendering mode. Quirks is a lot sloppier of a rendering engine. -=-=- Quit posting and try Google.
Fri, 02 Apr 2010, 05:26
steve_ancell	OK thanx Stealth, I guess I need to do more research on doctype then.