Forum Moderators: not2easy
=================
Html portion here
=================
<link rel="stylesheet" type="text/css" href="widget.css" />
<link rel="stylesheet" type="text/css"href="widget2..css" />
<link rel="stylesheet" type="text/css"href="widget3.css" />
</head>
<body>
<body onLoad="resizingWindowLoaded(1000, 1000)"
onResize="resizingWindowResized()">
<?php include("headings.php"); ?>
<?php include("heading2.php"); ?>
========================
Some CSS portion here
========================
.Block {
position:absolute;
left:26% ;
top:29%;
height: 36em;
width:40em;
border-right:1px solid white;
Border-top: 1px Solid white;
Border-bottom: 1px Solid white;
Border-left: 1px Solid white;
padding:10px;
background-color:#606060;
}
h2 {
position: Relative;
color :#FF1493;
font-family : Arial ;
font-weight : bold;
font-variant : small-caps;}
=================
Anyone know of any reasons why firefox does not apply CSS setting yet internet explorer will ?
The provided sample renders CSS in both FF & IE; not the same, or even close, but the CSS is applied.
However, the CSS is inconsistently presented which indicates a high likelihood of errors in other places. Sometimes uppercase, sometimes lower. Sometimes extra space, sometimes not. These are red flags.
malcolmcroucher noted one error, but the small sample has numerous inconsistencies
I would recommend W3C validation of all of the CSS pages, plus the HTML and see what errors can be eliminated.
<html>
<head>
<style>
.block {
position: absolute;
left: 26% ;
top: 29%;
height: 36em;
width: 40em;
border: 1px solid #fff
padding: 10px;
background-color: #606060;
color: #fff;
}
h2 {
color: #ff1493;
font: small caps, bold 1.5em Arial, Verdana, sans-serif;
}
</style>
</head>
<body>
<div class="block">
class="block"
<h2>
HEADING 2
</h2>
</div>
</body>
</html>
I had a same problem...
IE works the CSS fine but firefox wont,
returned warning from firefox:
The stylesheet [example...] was loaded as CSS even though its MIME type, "text/html", is not "text/css"
But now i have that problem fixed,
just simply add a PHP line:
header('Content-type: text/css')
The dtd is your doctype definition that is at the top of your page.
example:
_______________
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<title></title>
</head>
<body>
</body>
</html>
______________________
I use the xhtml strict for my pages, there are other versions available as well.
Here, from the W3C [w3.org] is a bit of information for you on this. To learn more about it you can google this and find more information on it. Or post m ore questions if you have any and someone will help you with it.
Malcom
What are the implications of not having validated web sites in terms of html , xhtml and css ?
Next, if you do have some errors, it might be the reason why some things don't display correctly for you.
Sometimes, no matter how many times you view your code when things don't layout correctly, you can miss a typo, an incorrectly nested list, a closing tag on your xhtml code.
There is a tool bar that you can get for Firefox called the Web Developers tool bar. With this you can right clik on your page, go to the Web Developer, the side drop out box will have a section that says tools on it. Within that area you will find the tool for validating your local (x)html and css.
I use it all the time. Then when your page goes live, you can always test it again.
Also, if you don't wish to install the tool bar on firefox you can go Here. [validator.w3.org] If you look at the page it has tabs on it. There is a tab there you can click which allows you to copy and paste your code onto the validates site and it will validate it for you.
I hope I was able to help you out a little bit with your questions. Feel free to post more if you have them!
4~css!