Skip to content

Instantly share code, notes, and snippets.

@dz

dz/fixes-for-IE.patch

Created October 21, 2009 03:40
Show Gist options
  • Save dz/214856 to your computer and use it in GitHub Desktop.
Save dz/214856 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
fixes-for-IE.patch
From 4aa1519c5939fc1500b8f547e6006c1425f91dcd Mon Sep 17 00:00:00 2001
From: DZ <[email protected]>
Date: Tue, 20 Oct 2009 23:39:43 -0400
Subject: [PATCH] fixes for IE
---
css/master.css | 171 +++++++++++++++++++++++++++++++++++++++++++-------------
index.html | 166 +++++++++++++++++++++++-------------------------------
2 files changed, 203 insertions(+), 134 deletions(-)
diff --git a/css/master.css b/css/master.css
index f0ba701..4dd4e33 100644
--- a/css/master.css
+++ b/css/master.css
@@ -1,3 +1,37 @@
+/* Reset.css by Eric Meyer: http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/ */
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center, dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td {
+margin: 0; padding: 0; border: 0; outline: 0;
+font-size: 100%; vertical-align: baseline;
+background: transparent; }
+body { line-height: 1; }
+ol, ul { list-style: none; }
+blockquote, q { quotes: none; }
+ins { text-decoration: none; }
+del {text-decoration: line-through;}
+table { border-collapse: collapse; border-spacing: 0; }
+
+/* http://www.positioniseverything.net/easyclearing.html */
+.clearfix:after {
+ content: ".";
+ display: block;
+ height: 0;
+ clear: both;
+ visibility: hidden;
+}
+.clearfix {display: inline-block;}
+/* Hides from IE-mac \*/
+.clearfix {display: block;}
+* html .clearfix {height: 1%;}
+/* end hide from IE-mac */
+
+
html {
height:100%;
}
@@ -19,8 +53,6 @@ img {
/* 3 Column Liquid-Fixed-Liquid Layout */
div#container {
- width:100%;
- height:auto;
}
div#wrapside1 {
@@ -35,15 +67,16 @@ div#side1 {
height:auto;
}
div#content {
- float:left;
+ float:left; display: inline;
width:1002px;
height:auto;
position:relative;
background-image:url("../images/index_bg.png");
background-repeat:repeat-y;
+
}
div#wrapside2 {
- float: right;
+ float: left;
width: 50%;
height:auto;
margin-left:-501px;
@@ -93,18 +126,19 @@ div#side2 {
}
#header .right {
- position:absolute;
- right:0px;
+ float: right; display: inline;
+ width: 480px;
text-align:right;
margin-top:8px;
}
+
/* Styles for the CSS Based Quick Links Menu */
#quicklinks ul {
list-style: none;
margin:0px;
padding:0px;
- float: left;
+ float: right;
}
#quicklinks a {
@@ -131,6 +165,20 @@ div#side2 {
text-align:center;
}
+#quicklinks .quicklinks_menu {
+ margin-top: 3px;
+}
+#quicklinks .small_logo {
+ margin-top: 3px;
+ width: 93px;
+}
+#quicklinks .quicklinks_menu {
+ width: 89px;
+}
+
+#quicklinks .search_form {
+ width: 260px;
+}
/* Sub Styles for Side Rails/Gutters */
.blueBG {
@@ -162,6 +210,15 @@ div#side2 {
background-repeat:repeat-y;
}
+.table_image_fix td.top {
+ vertical-align: top;
+}
+
+.table_image_fix td.bottom {
+ vertical-align: bottom;
+}
+
+
.table_image_fix td img {
display:block;
}
@@ -169,11 +226,12 @@ div#side2 {
/* Styles for Middle Content Area Components*/
#photo {
- width:1002px;
+ width:1001px;
height:348px;
background-image:url("../images/1.png");
overflow:hidden;
z-index:50;
+ float: left; display: inline;
}
#photo .big_logo {
@@ -181,9 +239,9 @@ div#side2 {
}
#gutter_shadow {
- width:1116px;
- padding:0px 52px;
- margin-left:-52px;
+ width:1002px;
+ padding:0px 52px 0 52px;
+ margin: auto;
background-image:url("../images/gutter_shadow.png");
background-repeat:repeat-y;
}
@@ -200,62 +258,92 @@ div#side2 {
}
#nav_menu {
- height:43px;
+ width: 1002px;
+ float: left; clear: both;
background-image:url("../images/new_nav_bg_v2.gif");
background-repeat:repeat-x;
background-position:center;
margin:0px;
padding:0px;
- width:1002px;
-
+ zoom: 1;
}
-#nav_menu ul {
- list-style: none;
- margin:0px 10px 0px 10px;
-
- padding:0px;
- float: left;
-}
#nav_menu a {
vertical-align:middle;
text-decoration: none;
}
-#nav_menu a:hover {
- text-decoration:underline;
- color:#F6F1E8;
+ #nav_menu a:hover {
+ text-decoration:underline;
+ color:#F6F1E8;
+ }
+
+#nav_menu ul {
+ float: left;
+ cursor:pointer;
+ font-family:Times;
+ font-size: 15px;
+ color:white;
}
-#nav_menu li {position: relative; cursor:pointer; height:35px; font-family:Times; font-size: 15px; color:white; padding-top:13px;}
-#nav_menu li li {
+#nav_menu li {
+ height: 35px;
+ float: left;
position: relative;
- cursor:pointer;
- width:100%;
+ cursor: pointer;
height:auto;
- margin:0px;
- padding:0px;
+ margin: 0 10px 0 0;
+ padding: 13px 0px 13px 0px;
border-bottom:1px solid #613023;
+ zoom: 1;
}
+ #nav_menu li span {
+ display: block;
+ cursor: pointer;
+ padding: 0 20px 0 10px;
+ border-right:1px solid #8b5945;
+ }
+
+ #nav_menu li.last span {
+ border: none;
+ }
+
+#nav_menu li li {
+ border: none;
+ float: none;
+ display: block;
+ zoom: 1;
+ padding: 0;
+}
+
+ #nav_menu li li a {
+ display: block;
+ zoom: 1;
+ }
+
+ #nav_menu li li a:hover {
+ text-decoration: underline;
+ }
+
+ #nav_menu li li span {
+ border: none;
+ display: block;
+ }
+
#nav_menu ul ul {display: none;}
-#nav_menu ul li:hover ul {display: block; z-index:1000;}
+#nav_menu ul li:hover ul, ul li.hover ul { z-index:1000; display: block;}
#nav_menu ul ul {
position: absolute;
- bottom:48px;
- margin-left:-18px;
+ bottom: 41px;
+ margin-left:-21px;
border: 1px solid #613023;
border-bottom: 1px solid #2F1C18;
- background-image:url("../images/nav_bg.png");
- /*background-color:#773d29;*/
+ /*background-image: url("../images/nav_bg.png");*/
+ background-color:#773d29;
}
-#nav_menu .menu_divider {
- border-right:1px solid #8b5945;
- margin-top:10px;
- height:22px;
-}
#nav_menu .text {
font-family:Arial;
@@ -457,6 +545,9 @@ div .horz_divider {
margin-top:15px;
}
+#quicklinks ul {
+ display: inline-block;
+}
/* Utility Styles */
.full_width {
diff --git a/index.html b/index.html
index c2da8b1..c263f6f 100644
--- a/index.html
+++ b/index.html
@@ -20,17 +20,13 @@
<span class="widget text">Tuesday, February 24 2009</span>
</div>
<div class="right">
- <div id="quicklinks">
- <ul style="display:inline; float:left">
+ <div id="quicklinks" class="clearfix">
+ <ul class="small_logo">
<li>
- <span class="widget text">Search</span>
- <form action="index_submit" method="get" accept-charset="utf-8" style="display:inline;">
- <input class="widget" style="margin-right:12px; display:inline;" type="text" name="search" value="" id="search">
- <input class="widget" style="display:inline;" type="image" src="images/search_arrow.png" name="search_submit" value="submit" id="search_submit">
- </form>
+ <img class="widget" style="margin-left:18px; margin-right:2px;" alt="small logo" src="images/gu_logo_small.png" />
</li>
</ul>
- <ul>
+ <ul class="quicklinks_menu">
<li><span class="text widget">|&nbsp;&nbsp;&nbsp;&nbsp;Quick&nbsp;Links</span>
<ul>
<li><a href="#"><span class="text">Email</span></a></li>
@@ -41,48 +37,79 @@
</ul>
</li>
</ul>
- <ul>
+ <ul class="search_form">
<li>
- <img class="widget" style="margin-left:18px; margin-right:2px;" alt="small logo" src="images/gu_logo_small.png" />
+ <span class="widget text">Search</span>
+ <form action="index_submit" method="get" accept-charset="utf-8" style="display:inline;">
+ <input class="widget" style="margin-right:12px; display:inline;" type="text" name="search" value="" id="search">
+ <input class="widget" style="display:inline;" type="image" src="images/search_arrow.png" name="search_submit" value="submit" id="search_submit">
+ </form>
</li>
</ul>
+
</div>
</div>
</div>
</div>
<div id="header_gap" style="width:100%; height:40px; clear:both;">
</div>
- <div id="container">
- <div id="wrapside1">
+ <div id="billboard" class="clearfix">
+ <div id="wrapside1">
<div id="side1">
<div class="table_image_fix">
<table border="0" cellpadding="0" cellspacing="0" width="100%" height="244px" class="blueBG">
<!-- fwtable fwsrc="box shadow.png" fwpage="Page 1" fwbase="Untitled-5.jpg" fwstyle="Generic" fwdocid = "2007243299" fwnested="0" -->
<tr>
<td align="left" rowspan="3" width="44px"><img name="shadow_left" src="images/shadow_left.png" width="44" height="348" border="0" id="shadow_left" alt="" /></td>
- <td valign="top"><img name="shadow_top" src="images/shadow_top.png" width="100%" height="40" border="0" id="shadow_top" alt="" /></td>
+ <td class="top">
+ <table width="100%" height="348" cellspacing="0" cellpadding="0" border="0">
+ <tr><td class="top">
+ <img name="shadow_top" src="images/shadow_top.png" width="100%" height="40" border="0" id="shadow_top" alt="" />
+ </td></tr><tr><td class="bottom">
+ <img name="shadow_bottom" src="images/shadow_bottom.png" width="100%" height="40" border="0" id="shadow_bottom" alt="" />
+ </td></tr></table>
+ </td>
<td align="right" rowspan="3" width="44px"><img name="shadow_right" src="images/shadow_right.png" width="44" height="348" border="0" id="shadow_right" alt="" /></td>
</tr>
- <tr>
- <td></td>
- </tr>
- <tr>
- <td valign="bottom"><img name="shadow_bottom" src="images/shadow_bottom.png" width="100%" height="40" border="0" id="shadow_bottom" alt="" /></td>
- </tr>
+
</table>
</div>
</div>
</div>
-
- <div id="content">
- <div id="photo">
+ <div id="photo">
+ </div>
+ <div id="wrapside2">
+ <div id="side2">
+ <div class="table_image_fix">
+ <table border="0" cellpadding="0" cellspacing="0" width="100%" height="244px" class="blueBG">
+ <!-- fwtable fwsrc="box shadow.png" fwpage="Page 1" fwbase="Untitled-5.jpg" fwstyle="Generic" fwdocid = "2007243299" fwnested="0" -->
+ <tr>
+ <td align="left" rowspan="3" width="44px"><img name="shadow_left" src="images/shadow_left.png" width="44" height="348" border="0" id="shadow_left" alt="" /></td>
+ <td class="top">
+ <table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0">
+ <tr><td class="top">
+ <img name="shadow_top" src="images/shadow_top.png" width="100%" height="40" border="0" id="shadow_top" alt="" />
+ </td></tr><tr><td class="bottom">
+ <img name="shadow_bottom" src="images/shadow_bottom.png" width="100%" height="40" border="0" id="shadow_bottom" alt="" />
+ </td></tr></table>
+ </td>
+ <td align="right" rowspan="3" width="44px"><img name="shadow_right" src="images/shadow_right.png" width="44" height="348" border="0" id="shadow_right" alt="" /></td>
+ </tr>
+
+ </table>
+ </div>
</div>
- <div id="gutter_shadow">
- <div id="nav_menu">
+ </div>
+ </div>
+ <div id="container">
+ <div id="gutter_shadow" class="clearfix">
+ <div id="content">
+ <div id="nav_menu" class="clearfix">
<div class="fake_center">
- <ul>
- <li>Admissions
+ <ul class="clearfix">
+ <li>
+ <span>Admissions</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -90,12 +117,8 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Students
+ <li>
+ <span>Students</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -103,12 +126,8 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Academics
+ <li>
+ <span>Academics</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -116,12 +135,8 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Faculty
+ <li>
+ <span>Faculty</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -129,12 +144,9 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Centers&nbsp;&amp;&nbsp;Institutes
+
+ <li>
+ <span>Centers&nbsp;&amp;&nbsp;Institutes</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -142,12 +154,9 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Alumni
+
+ <li>
+ <span>Alumni</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -155,12 +164,9 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Career&nbsp;Services
+
+ <li>
+ <span>Career&nbsp;Services</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -168,12 +174,9 @@
<li><a href="#"><span class="text">Florence&nbsp;Summer&nbsp;Law&nbsp;Program</span></a></li>
</ul>
</li>
- </ul>
- <ul class="menu_divider">
- <li ></li>
- </ul>
- <ul>
- <li>Library&nbsp;&amp;&nbsp;Technology
+
+ <li class="last">
+ <span>Library&nbsp;&amp;&nbsp;Technology</span>
<ul>
<li><a href="#"><span class="text">Public&nbsp;Interest&nbsp;Center</span></a></li>
<li><a href="#"><span class="text">Commercial&nbsp;Law&nbsp;Center</span></a></li>
@@ -266,32 +269,7 @@
</div>
</div>
- </div>
-
- <div id="wrapside2">
- <div id="side2">
- <div class="table_image_fix">
- <table border="0" cellpadding="0" cellspacing="0" width="100%" height="244px" class="blueBG">
- <!-- fwtable fwsrc="box shadow.png" fwpage="Page 1" fwbase="Untitled-5.jpg" fwstyle="Generic" fwdocid = "2007243299" fwnested="0" -->
- <tr>
- <td align="left" rowspan="3" width="44px"><img name="shadow_left" src="images/shadow_left.png" width="44" height="348" border="0" id="shadow_left" alt="" /></td>
- <td valign="top"><img name="shadow_top" src="images/shadow_top.png" width="100%" height="40" border="0" id="shadow_top" alt="" /></td>
- <td align="right" rowspan="3" width="44px"><img name="shadow_right" src="images/shadow_right.png" width="44" height="348" border="0" id="shadow_right" alt="" /></td>
- </tr>
- <tr>
- <td></td>
- </tr>
- <tr>
- <td valign="bottom"><img name="shadow_bottom" src="images/shadow_bottom.png" width="100%" height="40" border="0" id="shadow_bottom" alt="" /></td>
- </tr>
- </table>
- </div>
- </div>
- </div>
-
- <div class="clear"></div>
-
-
+ </div>
</div>
--
1.6.1.rc4+GitX
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment