Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@fwenzel

fwenzel/ie.html Secret

Created March 26, 2010 18:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save fwenzel/d0183454bf0eef3a19bb to your computer and use it in GitHub Desktop.
Save fwenzel/d0183454bf0eef3a19bb to your computer and use it in GitHub Desktop.
Download ZIP
An improved version of mozilla.com's IE landing page, bug 555235
Raw
ie.html
<!DOCTYPE HTML>
<html xml:lang="en-US" lang="en-US" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Firefox Browser | Faster &amp; Safer Internet | Free Download</title>
<base href="http://www.mozilla.com/"/>
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<style>
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small}table{font-size:inherit;font:100%}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}body{text-align:center}#ft{clear:both}#doc{margin:auto;text-align:left;width:57.69em;*width:56.25em;min-width:750px}
body{text-align:center;margin:0;padding:0;font-family:verdana}#doc{width:950px;margin:auto;text-align:left;position:relative;z-index:1}[dir="rtl"] #doc{text-align:right}#doc:after{content:".";display:block;height:0;clear:both;visibility:hidden}#wrapper{min-width:950px}.hide{display:none}body{background:#fff url("http://www.mozilla.com/img/tignish/template/background-tile.png") 50% 0 repeat-x}#header{width:920px;margin:0
15px;background:#1e4262 url("http://www.mozilla.com/img/tignish/template/header-background.png") bottom left no-repeat;height:56px;font-family:verdana}#header
h1{margin:0;float:left}#header h1
img{display:block}#header h1 a:link,
#header h1 a:visited{color:#fff}#nav-main{float:right;padding-right:200px}#moz_global_search{position:absolute;top:18px;right:30px}#moz_global_search
#query{border:1px
solid #07253e;width:100px;background-color:#9badbc;height:18px;float:left}#moz_global_search #query:focus{background-color:#fff}#moz_global_search
#submit{display:block;float:left}#footer{background:#fff url("http://www.mozilla.com/img/tignish/template/footer-border.png") top center repeat-x;text-align:center;color:#898378;margin-top:100px;clear:both;font-family:verdana;font-size:90%;min-height:80px}* html
#footer{height:80px}#footer a:link,
#footer a:visited{color:#898378;text-decoration:none}#footer a:hover,
#footer a:active{color:#69645c;text-decoration:underline}#footer-links{font-size:85%}#wrapper{background:url("http://www.mozilla.com/img/tignish/template/background-feature.jpg") top center no-repeat}#main-feature{font-size:110%;padding-top:45px;padding-bottom:1px}#main-feature
h2{margin:0
235px 0 35px;color:#fff;font-size:360%}#main-feature
p{font-size:165%;margin:8px
445px 35px 35px;color:#4b4742}#side-menu{position:absolute;top:75px;right:35px;left:auto;list-style-type:none;margin:0;padding:0;width:170px;font-family:verdana;font-size:80%;line-height:1}#side-menu
li{list-style-type:none;margin:0;padding:7px
3px 5px 5px;background:url("http://www.mozilla.com/img/tignish/template/side-menu-divider.png") top center no-repeat}#side-menu
li.first{background:none}#side-menu li
ul{margin:5px
0 0 0;left:auto}#side-menu li ul
li{padding-left:8px}#side-menu
span{color:#fff;font-weight:bold}#side-menu h3
span{font-weight:normal}#side-menu
h3{margin:0;color:#fff}#side-menu a:link,
#side-menu a:visited{color:#1e4262}#side-menu a:hover,
#side-menu a:active{color:#1e4262}#main-content{float:left;display:inline;width:555px;margin:65px
65px 0 30px;font-size:110%}#sidebar{float:left;display:inline;position:relative;width:265px;margin:0
30px 0 0;font-size:110%}#content{margin:0
35px;font-size:110%}body{font-family:georgia,serif;color:#807970}a:link,a:visited{text-decoration:none;color:#0489b7}a:hover,a:active{text-decoration:underline;color:#0489b7}a.external:link,a.external:visited{padding-right:8px}a.external:hover,a.external:active{padding-right:8px;background:transparent url("http://www.mozilla.com/img/tignish/content/external-link.png") center right no-repeat}p,
dd,
#content li,
#main-content
li{line-height:1.5}strong{font-weight:bold}em{font-style:italic}abbr,acronym{border-bottom:1px dotted #000;cursor:help}p,fieldset,table,pre{margin-bottom:1em}h1,h2,h3,h4,h5,h6{font-family:georgia,serif;font-weight:normal;color:#4b4740}h1{font-size:185%}h2{font-size:170%}h3{font-size:165%}h4{font-size:137%}h5{font-size:110%}h6{font-size:100%}h1,h2,h3{margin:1em
0}ul{margin:1em
0 1em 0;padding:0;position:relative;left: -10px;zoom:1}ul li,
ol li ul
li{list-style-type:none;padding:3px
0 4px 10px;background:url("http://www.mozilla.com/img/tignish/content/bullet.png") 0 10px no-repeat}html[dir=rtl] ul li,
html[dir=rtl] ol li ul
li{padding:3px
10px 4px 0;background-position:100% 10px}blockquote{margin:1em}ol,dl{margin:1em}ol,dl{margin-left:2em}ol li,
ul li ol
li{list-style:decimal outside;background:none}dl
dd{margin-left:1em}td,th{border:0}table.data-table{border-top:1px solid #eee}table.data-table td,
table.data-table
th{padding:0.5em 0.5em;border-bottom:1px solid #eee}ul.home-download,
ul.home-download
li{margin:0;padding:0;list-style-type:none;background:none}ul.home-download{margin-left:30px;width:300px;font-family:verdana,sans-serif}* html ul.home-download{margin-left:29px}a.download-link{display:block;height:63px;padding:15px
15px 15px 60px;background:url("http://www.mozilla.com/img/tignish/home/download-button.png") 0 0 no-repeat;color:#09700b}* html a.download-link{background:none;background:url("http://www.mozilla.com/img/tignish/home/download-button-ie.png") 0 0 no-repeat}a.download-link:hover{background-position: -300px 0;text-decoration:none;cursor:pointer}ul.home-download li a.download-link
span{color:#09700b;position:static;line-height:1.2}ul.home-download li a.download-link
em{display:block;font-size:73%;font-style:normal}ul.home-download li a.download-link em.download-lang{color:#42a313;margin-top:5px}.download-noscript{margin-left:35px;width:400px}.download-noscript
h3{font-size:120%;margin-bottom:0}.download-noscript h3
span{display:block;font-size:75%;color:#898378}.download-noscript
ul{margin-top:0.5em}#sidebar ul.home-download{margin:0;padding:0;left:auto;font-family:georgia,serif;width:265px}#sidebar ul.home-download
li{list-style-type:none;margin:0;padding:20px
0 0 0;background:url("http://www.mozilla.com/img/tignish/firefox/download-background.png") top left no-repeat}#sidebar ul.home-download li
h3{margin:0
80px 5px 10px;color:#69645b;font-size:175%}#sidebar ul.home-download li
div{font-size:85%;color:#898378;margin:0
85px 0 10px}#sidebar ul.home-download li a.download-link,
* html #sidebar ul.home-download li a.download-link{display:block;line-height:1;margin:12px
0 5px 3px;padding:0;height:auto;font-family:verdana,sans-serif;color:#09700b;text-decoration:none;background:url("http://www.mozilla.com/img/tignish/firefox/download-button.png") 0 0 no-repeat;min-height:22px;filter:none}#sidebar ul.home-download li a.download-link
span{line-height:1}* html #sidebar ul.home-download li a.download-link{height:22px}#sidebar ul.home-download li a.download-link span.download-link-text{display:block;background:url("http://www.mozilla.com/img/tignish/firefox/download-button.png") 0 100% no-repeat;padding:13px
15px 26px 42px}#sidebar ul.home-download li a.download-link
span.free{font-size:85%;color:#53b156}#sidebar ul.home-download li a.download-link:hover,
#sidebar ul.home-download li a.download-link:active{background-position: -300px 0;text-decoration:underline}#sidebar ul.home-download li a.download-link:hover span.download-link-text,
#sidebar ul.home-download li a.download-link:active span.download-link-text{background-position: -300px 100%}ul.os_linux li.os_windows,
ul.os_linux
li.os_osx{display:none}ul.os_windows li.os_linux,
ul.os_windows
li.os_osx{display:none}ul.os_osx li.os_linux,
ul.os_osx
li.os_windows{display:none}.download-other{font-family:verdana,sans-serif;font-size:70%;color:#ccc;margin-left:5px;position:relative;left:5px}#sidebar .download-other
a{margin-right:4px}.home-download
abbr{border-bottom:0}
#nav-main{float:right;padding-right:200px}
#nav-main ul{float:left;z-index:99;left:auto;background:transparent url("http://www.mozilla.com/img/tignish/template/header-nav-divider.png") top left no-repeat;padding-left:2px}
#nav-main ul li{float:left}
#nav-main ul,#nav-main ul li{height:56px;background:none;position:relative;padding:0;margin:0;list-style-type:none;}
#nav-main ul li a, #nav-main ul li span{padding:20px 20px 0 20px;height:35px;display:block;float:left;font-weight:bold;font-size:95%;color:#fff;background:transparent url("http://www.mozilla.com/img/tignish/template/header-nav-divider.png") top right no-repeat}
#nav-main ul li a:link,#nav-main ul li a:visited{color:#fff;text-decoration:none}
#nav-main ul li a:hover,#nav-main ul li a:active{color:#fff;background:#31526f url("http://www.mozilla.com/img/tignish/template/header-nav-menu-backgrounds.png") top right no-repeat}
body#firefox {
background-image: url("http://www.mozilla.com/img/tignish/firefox/background-tile.jpg");
}
body#firefox #wrapper {
background-image: none;
background-position: top center;
background-repeat: no-repeat;
}
body#firefox.variation4 #wrapper { background-image: url("http://www.mozilla.com/img/tignish/firefox/background-firefox-4.jpg"); }
#firefox #main-feature {
min-height: 315px;
padding-bottom: 15px;
}
* html #firefox #main-feature { height: 315px; /* Hack for IE6 */ }
#firefox #main-feature #feature-contents { min-height: 170px; }
* html #firefox #main-feature #feature-contents { height: 170px; /* Hack for IE6 */ }
#firefox #main-feature h2 {
padding-top: 15px;
margin-right: 215px;
letter-spacing: -1px;
font-size: 345%;
}
#firefox #main-feature p {
font-size: 135%;
margin-right: 355px;
margin-top: 0;
}
#firefox #content { margin-right: 200px; }
#firefox-sub-features {
background: url("./subfeature-background-ie-perftest.jpg") 20px 10px no-repeat;
margin: 40px 0 20px 0;
padding: 5px 20px 0 20px;
height: 200px;
font-size: 108%;
}
.sub-feature {
width: 244px;
height: 200px;
margin: 0 28px;
float: left;
display: inline; /* fix IE margin issue */
position: relative;
}
.sub-feature h3 a {
display: block;
position: relative;
}
.sub-feature h3 a:link,
.sub-feature h3 a:visited {
color: #4B4740;
}
.sub-feature h3 { margin-bottom: 5px; }
.sub-feature p {
font-size: 108%;
margin-bottom: 0;
margin-right: 15px;
color: #afaba3;
line-height: 1.4;
}
#firefox-awards.sub-feature h3 a {
padding-right: 100px;
}
#firefox-awards.sub-feature p {
margin-right: 130px;
}
.sub-feature a.bottom {
position: absolute;
bottom: 30px;
}
#main-feature p {
margin-bottom: 0px;
}
body#firefox #footer { margin-top: 40px; padding-top: 35px; }
/* }}} */
/* {{{ Download Button */
#firefox ul.home-download {
width: 365px;
margin: 0 0 0 28px;
left: auto;
}
#firefox ul.home-download li {
padding: 0;
position: relative;
height: 124px;
}
* html #firefox ul.home-download li {
background: none;
}
#firefox ul.home-download li a.download-link {
background-image: url("http://www.mozilla.com/img/tignish/firefox/download-button-primary.png");
height: 124px;
padding: 0;
}
#firefox ul.home-download li a.download-link span {
padding: 55px 20px 20px 128px;
height: 49px;
display: block;
}
* html #firefox ul.home-download li a.download-link {
background-image: url("http://www.mozilla.com/img/tignish/firefox/download-button-primary-ie.png");
}
#firefox ul.home-download li a:hover {
background-position: top left;
}
#firefox ul.home-download li a:hover span {
background: url("http://www.mozilla.com/img/tignish/firefox/download-button-primary.png") top right no-repeat;
}
* html #firefox ul.home-download li a.download-link:hover span {
background: url("http://www.mozilla.com/img/tignish/firefox/download-button-primary-ie.png") top right no-repeat;
}
#firefox ul.home-download li a.download-link span { line-height: 1.1; }
#firefox ul.home-download li a.download-link em { color: #38a801; }
#firefox ul.home-download li a.download-link strong {
font-family: georgia, serif;
font-weight: normal;
font-size: 145%;
padding-right: 27px;
background: url("http://www.mozilla.com/img/tignish/firefox/download-arrow.png") right center no-repeat;
}
#firefox ul.download li a.download-link:hover,
#firefox ul.download li a.download-link:active {
text-decoration: none;
}
#firefox #main-feature .download-other {
margin-left: 75px;
font-size: 70%;
}
.dl-box {
margin-bottom: 0;
}
</style>
</head>
<body id="firefox" class="variation4">
<div id="wrapper">
<div id="doc">
<div id="header">
<div>
<h1><a href="/en-US/" title="Back to home page"><img src="http://mozcom-cdn.mozilla.net/img/tignish/template/mozilla-logo.png" height="56" width="145" alt="Mozilla" /></a></h1>
<div id="nav-main" role="navigation">
<div class="bd">
<ul class="first-of-type">
<li><a href="/en-US/products/">Products</a></li>
<li><a href="https://addons.mozilla.org/">Add-ons</a></li>
<li><a href="http://support.mozilla.com/">Support</a></li>
<li><a href="/en-US/manyfaces/">Community</a></li>
<li><a href="/en-US/about/">About</a></li>
</ul>
</div>
</div>
<form id="moz_global_search" action="/en-US/search/" method="get">
<div role="search">
<input type="hidden" name="hits_per_page" id="hits_per_page" value="" />
<input type="hidden" name="hits_per_site" id="hits_per_site" value="" />
<input type="text" name="query" id="query" value="" aria-required="true" /><input type="image" src="http://mozcom-cdn.mozilla.net/img/tignish/content/search-button.png" id="submit" alt="Search" />
</div>
</form>
</div>
</div>
<div id="main-feature">
<div id="feature-contents">
<h2 id="firefox-headline">Meet the World’s Best Browser</h2>
<p id="firefox-intro">Switching from IE to Firefox is quick and easy - a safer, faster, more advanced Web is only a few clicks away!</p>
</div>
<div class="dl-box">
<ul class="home-download download-firefox os_windows ">
<li class="os_windows"> <a class="download-link" href="/products/download.html?product=firefox-3.6.2&amp;os=win&amp;lang=en-US"> <span><strong>Free Download</strong> <em>3.6.2 for Windows</em> <em>English (US)&nbsp;(7.7<abbr title="megabytes">MB</abbr>)</em></span></a> </li>
</ul>
<div class="download-other">
<span class="other">
<a href="/en-US/firefox/3.6.2/releasenotes/">Release Notes</a>
- <a href="/en-US/firefox/all.html">Other Systems and Languages</a>
</span>
</div>
</div>
</div>
<div><!-- empty div = dirty IE6 hack -->
<ul id="side-menu">
<li class="first"><h3><a href="/en-US/products/">Products</a> / <span>Firefox</span></h3></li>
<li><a href="/en-US/firefox/features/">Features</a></li>
<li><a href="/en-US/firefox/underthehood/">Under the Hood</a></li>
<li><a href="/en-US/firefox/security/">Security</a></li>
<li><a href="/en-US/firefox/customize/">Customization</a></li>
<li><a href="/en-US/firefox/organic/">100% Organic Software</a></li>
<li><a href="/en-US/firefox/tips/">Tips &amp; Tricks</a></li>
<li><a href="/en-US/firefox/video/">Videos</a></li>
<li><a href="/en-US/firefox/connect/">Connect</a></li>
</ul>
</div>
<div id="firefox-sub-features">
<div class="sub-feature" id="firefox-awards">
<h3><a href="/en-US/press/awards.html">Awards</a></h3>
<p>Firefox is great, but don't just take our word for it:</p>
<a href="/en-US/press/awards.html" class="bottom">See the Awards</a>
</div>
<div class="sub-feature" id="firefox-switch">
<h3><a href="/en-US/firefox/switch.html">Reasons to Switch</a></h3>
<p>Still not convinced?<br/>We've got even more reasons to switch to Firefox.</p>
<a href="/en-US/firefox/switch.html" class="bottom">Check Out the Reasons</a>
</div>
<div class="sub-feature" id="firefox-tips">
<h3><a href="/en-US/firefox/tips/">Tips &amp; Tricks</a></h3>
<p>Get handy hints for beginning, intermediate or advanced Firefox users.</p>
<a href="/en-US/firefox/tips/" class="bottom">Learn Some New Secrets</a>
</div>
</div>
</div>
<div id="footer">
<p id="footer-links"><a href="/en-US/privacy-policy.html">Privacy Policy</a> &nbsp;|&nbsp;
<a href="/en-US/about/legal.html">Legal Notices</a> &nbsp;|&nbsp;
<a href="/en-US/legal/fraud-report/index.html">Report Trademark Abuse</a>
</p>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment