Forum : IE 8 vs Firefox 3.7
Brief description  about Online courses   join in Online courses
View Anonymous  Anonymouse 's Profile

IE 8 vs Firefox 3.7

in IE 8 ...my webpage looks okay...but in firefox ...it looks odd...

<html>
<head>
<style type="text/css">
#main
{
width:900px;
border:1px solid black;
margin:auto;
}
#fill
{
padding:5px 10px;
height:200px;
background-image:url(./images/lighthouse.jpg);
}
.leftselect
{
width:60px;
height:47px;
border:1px groove blue;
margin-bottom:5px;
background-color:#D16587;

}
p.para{
font-family:Arial;font-weight:21px;}


a:link{text-decoration:none;font-family:verdana,Arial;
font-weight:14pt;
color:black;}
a:visited:{color:grey;text-decoration:none;font-family:verdana,Arial;
font-weight:14pt;}
a:hover{color:red;font-family:verdana,Arial;
font-weight:14pt;}
a:active{background-color:green;text-decoration:none;font-family:verdana,Arial;
font-weight:14pt;}
div.required
{
margin-left:200px;
text-decoration:underline;
margin-top:200px;
font-size:17pt;
font-family:cursive;}

div.required1{margin-left:200px;
text-decoration:underline;
margin-top:30px;
font-size:17pt;
font-family:cursive;}
</style>
<body>
<div id=main>
<div id=fill></div>
<div style="background-color:#659EC7;border-top:0;">
<div style="width:60px;float:left;">
<ol style="list-style-type:none;">
<li>

<div class=leftselect style="float:left;"><p style="text-align:center;"><a href=./assignment1.html>Home</a></p></div></li>

<li>

<div class=leftselect><p style="text-align:center;"><a href=#>About</a></p></div></li>

<li>

<div class=leftselect ><p style="text-align:center;"><a href=#>Service</a></p></div></li>
</ol></div>

<div class=required>Company Info</div><p style="text-align:justify;font-family:Arial;text-indent:3px;">A lighthouse is a tower, building, or framework designed to emit light from a system of lamps and lenses or, in older times, from a fire and used as an aid to navigation and to pilots at sea or on inland waterways.

Lighthouses are used to mark dangerous coastlines, hazardous shoals and reefs, and safe entries to harbors and can also assist in aerial navigation. Once widely used, the number of operational lighthouses has declined due to the expense of maintenance and replacement by modern electronic navigational aids.</p>


<div class=required1>Technology
</div><p style="text-align:justify;font-family:Arial;text-indent:3px;">In a lighthouse, the source of light is called the "lamp" (whether electric or fueled by oil) and the concentration of the light is by the "lens" or "optic". Originally lit by open fires and later candles, the Argand hollow wick lamp and parabolic reflector was developed around 1781 in Europe. In the US, whale oil was used with solid wicks as the source of light, until the Argand parabolic reflector system was introduced around 1810 by Winslow Lewis. Colza oil replaced whale oil in the early 1850s, but US farmers' lack of interest in growing this caused the service to switch to lard oil in the mid 1850s. Kerosene started replacing lard oil in the 1870s and the service was finally totally converted by the late 1880s. Electricity and carbide (acetylene gas) started to replace kerosene around the turn of the 20th century.[1] The use of the latter was promoted by the Dalén light, which automatically lit the lamp at nightfall and extinguished it at dawn. </p>



<div class=required1>Lens Technology
</div><p style="text-align:justify;font-family:Arial;text-indent:3px;">Prior to modern strobe lights, lenses were used to concentrate the light from a continuous source. Two tasks were involved:
<ul list-style-type:square>
<li>vertical light rays of the lamp are redirected into a horizontal plane <li>
<li>horizontally the light is focused into one or a few directions at a time, with the light beam sweeping around; as a result, in addition to seeing the side of the light beam, there are instances that one can see the light directly from a further distance away. </li></p>


<div class=required1 style=";">Design
</div><p style="text-align:justify;font-family:Arial;text-indent:3px;">In a lighthouse, the source of light is called the "lamp" (whether electric or fueled by oil) and the concentration of the light is by the "lens" or "optic". Originally lit by open fires and later candles, the Argand hollow wick lamp and parabolic reflector was developed around 1781 in Europe. In the US, whale oil was used with solid wicks as the source of light, until the Argand parabolic reflector system was introduced around 1810 by Winslow Lewis. Colza oil replaced whale oil in the early 1850s, but US farmers' lack of interest in growing this caused the service to switch to lard oil in the mid 1850s. Kerosene started replacing lard oil in the 1870s and the service was finally totally converted by the late 1880s. Electricity and carbide (acetylene gas) started to replace kerosene around the turn of the 20th century.[1] The use of the latter was promoted by the Dalén light, which automatically lit the lamp at nightfall and extinguished it at dawn.</p>
</div>

<div style="text-align:center;font-family:monospace;font-weight:bold;color:red;text-decoration:blink;">happy visit</div>
</div>
</div>
</div>
</body>
</html> //this my idiotic code...for assignment
Asked by Anonymous Anonymouse | Jul 8, 2010 |  Reply now
Replies (1)
View teacher siliconindia 's Profile
Hi

<link href="homeoutside/formozilla.css" rel="stylesheet" type="text/css" />
<link href="homeoutside/forie.css" rel="stylesheet" type="text/css" />
<link href="homeoutside/forie7new.css" rel="stylesheet" type="text/css" />


<!--[if IE 6]>
<link href="homeoutside/forie.css" rel="stylesheet" type="text/css" />
<![endif]-->

<!--[if IE 7]>
<link href="homeoutside/forie7.css" rel="stylesheet" type="text/css" />
<![endif]-->


We use the above code to overcome the browser compatibility issue.

How it works is. We have 3 different style sheets for IE6, IE7 and Mozilla.

First style sheet "formozilla.css" will work as the master style sheet. If you need any changes to be made in the master css file to adjust IE6 or IE7 just add the same id in the css file for IE6 and make the style change there.

So when the browser reads if that browser is IE6 it will compare both the style sheet, master style sheet and the IE6 style sheet. So if the browser find any change in the CSS file for IE6 it will take that particular style.

The beauty is Mozilla's style sheet will work for all other browsers other than IE. But IE6 style sheet wont work for IE 7 also. Hats off to microsoft :-)

Regards
Jul 11, 2010