0

I have a question as to why Internet Explore won't read my webpage...yet Firefox and Opera read it just fine...

To me, it seems that internet explore is disregarding my external CSS file...because when I launch the index.html file, IE reads it without the CSS file...I don't know why though...BUT...when I created another HTML file and linked ANOTHER CSS file that I quickly made, it worked fine...So it must be the CSS code or something...

Here is the HTML code...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>My Homepage</title>
<link rel="stylesheet type="text/css" href="index.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<h1>My Homepage</h1>
</div>
<div id="main">
<h2>Welcome to my Homepage</h2>
</div>
<div id="wrapper2">
<div id="nav2">
<a class="button" href="page1.html"><span>Page 1</span></a>
<a class="button" href="page2.html"><span>Page 2</span></a>
</div>
</div
<div id="footer">
<A HREF="http://www.freebuttons.com/"><IMG SRC="http://www.freebuttons.com/ima/banner2.gif" WIDTH=88 HEIGHT=31 BORDER=0 ALT="FreeButtons"></A> 
</div>
</div>
</body>
</html>

And here is the CSS code...

body {
	background-color: #00008B;
	font-size: 12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
div#wrapper {
 	width: 100%;
	background-color: #87CEFA;
	margin-top: auto;
	margin-bottom: 50px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	border: thin solid #FF0000;
}
div#header {
	padding: 15px;
	margin: 0px;
	text-align: center;
	text-decoration: underline;
	font-size: 1.5em;
	color: rgb(100,100,150);
}
div#wrapper2 {
 	width: 10.4%;
	background-color: #87CEFA;
	margin-top: 50px;
	margin-bottom: 50px;
	margin-left: 0px;
	margin-right: 50px;
	padding: 5px;
	border: thin solid #FF0000;
}
div#nav {
	width: 25%;
	padding: 10px;
	margin-top: 10px;
	float: auto;
}
div#main {
	margin-left: 30%;
	margin-top: 1px;
	padding: 10px;
}
div#footer {
	padding: 15px;
	margin: 0px;
	border-top: thin solid #FF0000;
}
a:link {
	text-decoration: overline;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
div#footer ul li{
	color: #000000;
	background-color: transparent;
	display: inline;
}
div#footer ul li a{
	color: #115EAC;
	background-color: transparent;
	text-decoration: none;
}
div#footer ul li a:hover{
	text-decoration: none;
}

.clear {
	overflow: hidden;
	width: 100%;
}
a.button {
	background: transparent url('http://www.freebuttons.com/freebuttons/Neon/NeonDh4.gif');
	color: white;
	display: block;
	float: auto;
	font: normal 12px arial, sans-serif;
	height: 24px;
	margin-right: 0px;
	padding: right: 18px; /* slidding doors padding */
	text-decoration: none;
}

a.button span {
	background: transparent url ('http://www.freebuttons.com/freebuttons/Neon/NeonDa4.gif');
	display: block;
	line-height: 14px;
	padding: 5px 0 5px 20px;
}

a.button:active {
	background-position: bottom right;
	color: #000;
	outline: none; /*hide dotted outline in Firefox */
}

a.button:active span {
	background-position: bottom left;
	padding: 6px 0 4px 18px; /*push text down lpx */
}

Im thinking it must be an Error inside the CSS file...I've deleted each section at one time in the CSS file and tested it, didn't work...I've deleted the ENTIRE DIV section, didn't work...in my test file, DIV worked and so did the CSS file...I created 2 new files, HTML and CSS, and copied the text from the old files into the new and saved it under a new name and still doesn't work...

I'm fairly new to HTML and CSS, so I'm kinda stuck...

It works fine in others browsers EXCEPT Internet Explore...and I want it to work with all browsers...

Anyone know what the problem is?

Thanks
Regards,
PcPro12

2
Contributors
3
Replies
4
Views
9 Years
Discussion Span
Last Post by PcPro12
0

I've fixed the problem...I can't believe firefox and opera overlooked this problem...

<title>My Homepage</title>
[B]<link rel=[U]"stylesheet[/U] type="text/css" href="index.css">[/B]
</head>

I missed a quotation mark ( " ) after stylesheet...and that didnt read the CSS file correctly in internet explore...

anyway, sorry for taking your time :)

0

I've fixed the problem...I can't believe firefox and opera overlooked this problem...

Actually it's IE that overlooked the problem.
For XHTML, quotes are required in this context, so FireFox and Opera handled it per definition. However, the error reporting is lousy for all browsers, possible in order to give the users the impression that errors can be fixed by ignoring them.

0

ohh...i see...im pretty new to this stuff...working my way up...so im still learning :)

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.