Internet Explorer中的CSS定位

Question

I've been unable to fix the IE 7 and 8 compatibility issues I am having with my CSS code.

The site is here .

In IE, the header is gone, the shadow boxes that are supposed to highlight the text (in the individual pages) are gone, spacing is horrible, the footer is misaligned, etc.

I experimented with z-index and position , but I just don't have the coding chops to fix this.

CSS

/**AGE VERIFICATION / SPLASH PAGE----
    -------------------------------------------------------------*/
#Splash {
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-family: 'Open Sans';
}
#SplashHolder {
    width: 650px;
    height: 280px;
    margin: 8% auto 0 auto;
    background: rgba(0,0,0,.7);
    padding: 15px;
    border: 3px double rgba(102,102,102,.5);
}
#SplashLogo {
    width: 182px;
    height: 73px;
    display: block;
    margin: 0 auto;
    background: url(../images/Logo_Splash.png) no-repeat;
}
#SplashBody h1, #SplashBody h2 {
    color: #fff;
    line-height: 24px;
    margin: 10px 0 0 0;
    padding: 0;
}
#SplashBody h2, .SplashAge li a {
    font-size: 16px
}
.SplashAge li a, #SplashHolder {
    box-shadow: 0 3px 5px rgba(0,0,0,.2)
}
.left {
    float: left
}
.right {
    float: right
}
.SplashAge li {
    width: 300px;
    display: inline;
}
.SplashAge li a {
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    display: block;
    background: rgba(206,55,34,.1);
    padding: 8px 15px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    border: 3px double rgba(206,55,34,.5);
}
.SplashAge li a:hover {
    background: rgba(206,55,34,.5)
}
#SplashInfoBottom {
    width: 450px;
    margin: 0 auto;
}
#SplashInfoBottom ul li {
    display: inline;
    float: left;
    margin: 5px 15px 0 0;
}
#SplashInfoBottom ul li h2 {
    font-size: 12px
}
#EventSplash {
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-family: 'Open Sans';
}
#EventSplashHolder {
    width: 750px;
    height: 460px;
    margin: 8% auto 0 auto;
    background: rgba(0,0,0,.7);
    padding: 15px;
    border: 3px double rgba(102,102,102,.5);
}
#EventSplashLogo {
    width: 182px;
    height: 73px;
    display: block;
    margin: 0 auto;
    background: url(../images/Logo_Splash.png) no-repeat;
}
#EventSplashBody h1, #EventSplashBody h2 {
    color: #fff;
    line-height: 24px;
    margin: 10px 0 0 0;
    padding: 0;
}
#EventSplashBody h2, .SplashAge li a {
    font-size: 16px
}
.EventSplashAge li a, #EventSplashHolder {
    box-shadow: 0 3px 5px rgba(0,0,0,.2)
}
.left {
    float: left
}
.right {
    float: right
}
.EventSplashAge li {
    width: 350px;
    display: inline;
}
.EventSplashAge li a {
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    display: block;
    background: rgba(206,55,34,.1);
    padding: 8px 15px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    border: 3px double rgba(206,55,34,.5);
}
.EventSplashAge li a:hover {
    background: rgba(206,55,34,.5)
}
#EventSplashInfoBottom {
    width: 450px;
    margin: 0 auto;
}
#EventSplashInfoBottom ul li {
    display: inline;
    float: left;
    margin: 5px 15px 0 0;
}
#EventSplashInfoBottom ul li h2 {
    font-size: 12px
}
/*--HEADER, NAV AND SUB NAV-
    ----------------------------------------------------------*/
.main {
    width: 100%;
    margin-bottom: 0;
}
#EnjoyResponsibly {
    position: absolute;
    right: 15px;
    top: 20px;
    z-index: 1000;
}
#NavBack {
    position: absolute;
    left: 0px;
    top: 0px;
    background: rgba(35, 31, 32, .8);
    height: 55px;
    border-bottom: 9px solid #231f20;
    width: 100%;
    z-index: 800;
}
#NavBackBlue {
    position: absolute;
    left: 0px;
    top: 56px;
    border-bottom: 1px dotted #221b5e;
    : ;
    height: 3px;
    width: 100%;
    z-index: 800;
}
.nav_container {
    position: absolute;
    width: 100%;
    z-index: 1000;
    text-align: left;
}
.navWrap {
    position: relative;
    top: 0px;
    left: 10px;
    padding: 0px 3px 3px 3px;
    width: 80%;
    min-width: 600px;
    height: 56px;
    background: none;
}
.nav {
    float: left;
    width: 100%;
    height: 57px;
}
a#logo {
    float: left;
    display: block;
    width: 140px;
    height: 47px;
    text-indent: -9999px;
    outline: none;
    margin: 6px 23px 9px 11px;
    background: url("../images/GTD_Logo.png") 0 0 no-repeat;
}
.nav ul {
    list-style: none;
    float: left;
    width: 600px;
    margin: 0px auto;
    font-size: 11px;
}
.nav li {
    float: left
}
.nav ul .MainNavigation {
    width: 600px;
    margin: 0 auto;
}
.nav a {
    color: #ccc;
    text-decoration: none;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: .1em;
}
.nav a.navTrigger {
    float: left;
    position: relative;
    z-index: 10;
    display: block;
    font-size: 16px;
    padding: 0 7px;
    font-size: 16px;
}
.nav a.navTrigger span {
    padding: 23px 1px 23px;
    float: left;
    display: block;
    outline: none;
    z-index: 10;
    position: relative;
    text-align: center;
}
.nav a.Inner span {
    width: 180px
}
.nav a.Products span {
    width: 100px
}
.nav a.connect span {
    width: 100px
}
.nav a.event span {
    width: 135px
}
.nav a.open span, .nav a.active span {
    color: #fff;
    top: 1px;
    padding: 22px 1px 24px 1px;
    text-shadow: 0px 0px 1px #ccc;
}
.nav .subnav ul, .navWrap {
    background: rgba(0, 0, 0, .8);
    border-top: 0;
}
.navWrap {
    border: 1px dotted #221b5e;
    border-top: 0;
}
.nav .subnav ul, .nav {
    border: 1px dotted #231f20;
    border-top: 0;
}
.nav .subnav {
    position: relative
}
.nav .subnav ul {
    display: none;
    position: absolute;
    top: 57px;
    left: 1px;
    z-index: 1;
    font-size: 11px;
    width: 159px;
    padding: 6px 6px 6px 0;
}
.navWrap, .nav .subnav ul {
    box-shadow: 0px 3px 5px #000
}
.nav .subnav ul li {
    display: block;
    float: none;
    padding: 3px 10px 3px 18px;
}
.nav .subnav ul li:first-child {
    padding-top: 12px
}
.nav .subnav ul li:last-child {
    padding-bottom: 12px
}
.nav ul li:hover .subnav ul li a {
    margin: 0;
    border: 0;
}
.nav .subnav ul li a {
    margin: 0;
    font-size: 12px;
}
.nav .subnav ul li:hover {
    color: #000
}
.nav .subnav ul li:first-child:hover {
    background: url("/assets/global/nav_indent.png") -5px 13px no-repeat
}
.nav .subnav ul li:hover a {
    margin: 0;
    border: 0;
    background: 0;
}
#AboutDD ul {
    width: 235px
}
#MakesDD ul {
    width: 570px;
    left: -292px;
    height: 320px;
}
#MakesDD ul li {
    width: 140px;
    margin: 5px;
    position: absolute;
}
#MakesDD ul li#middle {
    margin: 24px 0 0 195px
}
#MakesDD ul li#Last {
    margin: 24px 0 0 385px
}
#MakesDD ul li#BL {
    margin: 184px 0 0 5px
}
#MakesDD ul li#BC {
    margin: 184px 0 0 195px
}
#MakesDD ul li#BR {
    margin: 184px 0 0 385px
}
#MakesDD ul li a img {
    opacity: .6
}
#MakesDD ul li a img:hover {
    opacity: 1
}
#MakesDD ul li a span {
    font-size: 10px;
    color: #ccc;
}
.subnav ul li h3, .subnav ul li span {
    color: #fff
}
.subnav ul li h3 {
    font-size: 18px
}
#MakesDD ul li a span.bottle {
    float: left;
    width: 55px;
    height: 90px;
}
#ConnectDD ul {
    width: 200px;
    left: -22px;
}
#ConnectDD ul li {
    width: 180px
}
#ConnectDD ul li.Distributor {
    height: 80px
}
#EventsDD ul {
    width: 600px;
    left: -400px;
    height: 400px;
}
#EventsDD ul li {
    width: 600px;
    margin: 5px;
    position: absolute;
}
#EventsDD ul li a img {
    opacity: .6
}
#EventsDD ul li a img:hover {
    opacity: 1
}
#EventsDD ul li a span {
    font-size: 10px;
    color: #ccc;
}
.subnav ul li h3, .subnav ul li span {
    color: #fff
}
.subnav ul li h3 {
    font-size: 18px
}
#EventsDD ul li.ImagDrop {
    width: 600px;
    height: 400px;
}
#EventsDD ul li.ImagDrop {
    margin-top: 15px;
    position: absolute;
}
#EventsDD ul li#BMC {
    margin: 24px 0 0 5px
}
.Menu_DD_Events {
    position: absolute;
    z-index: 10;
    background: rgba(24, 24, 24, .7);
    padding: 0;
    margin: -20px 0 0 -20px;
}
.DDHeading {
    margin-top: 80px;
    position: absolute;
    z-index: 10;
    color: #ccc;
    padding: 6px 8px;
}
#MakesDD ul li.ImagDrop {
    width: 140px;
    height: 114px;
}
.DDHeading {
    margin-top: 80px;
    position: absolute;
    z-index: 10;
    color: #ccc;
    padding: 6px 8px;
}
.Menu_DD_Bottles {
    position: absolute;
    z-index: 10;
    background: rgba(24, 24, 24, .7);
    padding: 0;
    margin: -20px 0 0 -20px;
}
#MakesDD ul li.ImagDrop {
    margin-top: 15px;
    position: absolute;
}
.social {
    display: inline;
    float: right;
    height: 57px;
    border-left: 1px solid #181818;
    width: 24px;
    margin-top: -5px;
    margin-right: 4px;
}
.social a.twit, .social a.fb {
    display: block;
    outline: none;
    text-indent: -9999px;
    width: 20px;
    background-repeat: no-repeat;
    background-image: url("../images/social-icons-sprite.png");
}
.social a.twit {
    height: 17px;
    background-position: 2px 0;
    margin: 9px 0 8px 4px;
}
.social a.twit:hover {
    background-position: -19px 0
}
.social a.fb {
    height: 21px;
    background-position: 2px -23px;
    margin: 0 0 0 4px;
}
.social a.fb:hover {
    background-position: -19px -23px
}
.contentWrap {
    width: 700px;
    padding-bottom: 0px;
    margin-left: 15px;
}
.contentWrapMed {
    width: 900px;
    padding-bottom: 0px;
    margin-left: 15px;
}
.contentWrapBig {
    width: 1000px;
    padding-bottom: 0px;
    margin-left: 15px;
}
.facebook_tab .contentWrap {
    width: 492px;
    background: none;
    margin: 0;
    padding: 0;
}
.content {
    width: 700px;
    padding: 110px 0 0 50px;
    background: url("images/BottlesBack.png") top right;
    min-height: 700px;
    box-shadow: 0 0 8px #000;
}
.contentMed {
    width: 900px;
    padding: 110px 0 0 50px;
    background: url("images/BottlesBack.png") top right;
    min-height: 700px;
    box-shadow: 0 0 8px #000;
}
.contentBig {
    width: 1000px;
    padding: 110px 0 0 50px;
    background: url("images/BottlesBack.png") top right;
    min-height: 700px;
    box-shadow: 0 0 8px #000;
}
.contentBloody {
    width: 900px;
    padding: 50px 0 0 50px;
    background: url("images/BloodyTexture.png") top right;
    min-height: 700px;
    box-shadow: 0 0 8px #000;
}
.facebook_tab .content {
    width: 492px;
    background: none;
    margin: 0;
    padding: 0;
}
.content h1 {
    font-size: 23px;
    color: #704a3c;
    letter-spacing: 1px;
    margin-bottom: 13px;
    text-transform: uppercase;
    max-width: 575px;
    clear: both;
}
.facebook_tab .content h1 {
    text-indent: -9999px;
    margin-bottom: 0;
    width: 492px;
    height: 254px;
    background: url("/assets/facebook_tab/main_heading.png");
}
.content h2 {
    font-size: 24px;
    color: #2c2c2c;
    line-height: 30px;
    margin-bottom: 30px;
    max-width: 575px;
}
.content h3 {
    font-size: 14px;
    color: #704a3c;
    line-height: 14px;
    letter-spacing: 1px;
    margin-bottom: 2px;
    text-transform: uppercase;
    max-width: 575px;
}
.content p {
    max-width: 575px
}
.contentBloody h1 {
    font-size: 23px;
    color: #704a3c;
    letter-spacing: 1px;
    margin-bottom: 13px;
    text-transform: uppercase;
    max-width: 575px;
    clear: both;
}
.contentBloody h2 {
    font-size: 24px;
    color: #2c2c2c;
    line-height: 30px;
    margin-bottom: 30px;
    max-width: 575px;
}
.contentBloody h3 {
    font-size: 14px;
    color: #704a3c;
    line-height: 14px;
    letter-spacing: 1px;
    margin-bottom: 4px;
    text-transform: uppercase;
    max-width: 575px;
}
.contentBloody p {
    max-width: 575px
}
/*--PAGES----------------------------------------------------*/
.BottlePhoto {
    display: inline;
    float: right;
    width: 300px;
    height: 600px;
    margin: 0 20px 0 0;
}
.BottlePhotoBig {
    display: inline;
    float: right;
    width: 400px;
    height: 700px;
    margin: 0 100px 0 0;
}
.BottlePhotoMap {
    display: inline;
    float: right;
    width: 500px;
    height: 600px;
    margin: 0 20px 0 0;
}
.BloodyEvent {
    display: inline;
    float: left;
    width: 550px;
    height: 200px;
    margin: 0 100px 0 0;
}
#WireWorks {
    background: url(../images/Wireworks_Side.jpg) top center
}
#Firepuncher {
    background: url(../images/firetext.jpg) top center no-repeat
}
#MedfordRumBack {
    background: url(../images/barrel1.jpg) center no-repeat
}
#SpecialReserveBack {
    background: url(../images/SpecialReserve_Side.jpg) top center no-repeat
}
#Amandine {
    background: url(../images/amandine_side.jpg) top center
}
#Craneberry {
    background: url(../images/craneberry_side.jpg) top center
}
#Angelica {
    background: url(../images/angelica_Side.jpg) top center
}
#AboutPage {
    background: url(../images/About_Side.jpg) top center
}
#CraftPage {
    background: url(../images/Craft_Side.jpg) top center
}
#LibationPage {
    background: url(../images/Libation_Side.jpg) top center
}
#TheCraftBack {
    background: url(../images/Background_Tub.jpg) center
}
#ContentPageBack {
    background: url(../images/BottleBack.png) rgba(255,255,255,.9);
    width: 100%;
    height: 100%;
}
#ContentPageBackBloody {
    background: url(../images/BloodyTexture.png) rgba(255,255,255,.9);
    width: 100%;
    height: 100%;
}
/*--TABLES--------------------------------------------------------*/
/*-FOOTER-----------------------------------------------------------*/
#ft_wrapper {
    height: 15px;
    clear: both;
}
#footer_top {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}
.touch #footer_top {
    position: relative
}
.non_sticky #footer_top {
    position: relative;
    top: auto;
    left: auto;
}
.anchorTab {
    position: absolute;
    top: -60px;
    right: 30px;
}
.anchorTab a {
    display: block;
    outline: none;
    text-indent: -9999px;
    width: 324px;
    height: 144px;
    background: url(../images/Toggle.png) 0 0 no-repeat;
}
.anchorTab a.open {
    background-position: 0 -200px
}
.footer {
    float: left;
    width: 100%;
    background: url(../images/Menu_Back.jpg) repeat;
}
.FooterPattern {
    height: 81px;
    width: 100%;
}
.FooterPattern ul {
    display: block;
    margin: 0px 0 0 20px;
    width: 100%;
}
.FooterPattern ul li {
    display: inline;
    float: left;
    margin: 30px 25px 0 0;
}
.FooterPattern ul li a {
    color: #f0f0f0
}
.FooterPattern ul li a:hover {
    color: #be6045
}
#FooterContent {
    height: auto;
    min-height: 500px;
    width: 950px;
    margin-top: 55px;
}
#FooterHolder {
    height: 600px;
    width: 100%;
    display: block;
}
#FeaturesHolder {
    position: absolute;
    z-index: -1;
    margin: -100px 0 0 -100px;
}
#AnthemSobo {
    position: absolute;
    right: 20px;
    font-size: 9px;
    margin-top: 50px;
}
#AnthemSobo a {
    text-transform: lowercase;
    font-family: Arial, Helvetica, sans-serif;
}
#FooterTop {
    background: url(../images/FooterTopBottom.png);
    background-position: bottom;
    height: 75px;
}
#FooterBottom {
    background: url(../images/FooterBottomBottom.png) repeat
}
#FooterLeft, #FooterRight {
    position: absolute
}
#FooterLeft {
    z-index: 0;
    width: 100%;
    height: 485px;
    margin: 15px;
    left: 0;
}
#FooterLeft h1 {
    font-size: 50px;
    text-align: left;
    margin: 0;
}
.FooterFeatureImage, .FooterFeatureCopy {
    display: inline
}
.FooterFeatureCopy {
    float: left;
    margin-top: 30px;
    width: 600px;
    text-align: left;
}
.FooterFeatureCopy p {
    width: 250px;
    font-family: "Times New Roman", Times, serif;
}
.FooterFeatureImage {
    float: left;
    margin: 0;
}
.white {
    color: #fff
}
.shadow {
    color: #fff;
    text-shadow: 0px 2px 3px #555;
}
.Background_white {
    background: rgba(255,255,255,.8);
    padding: 3px 8px;
    width: 150px;
}
.top_15 {
    margin-top: 150px
}
.Now {
    background: url(../images/footer/now.jpg) no-repeat
}
.WireWorks {
    background: url(../images/footer/WireWorks_Footer.jpg) repeat
}
.GinAndJuice {
    background: url(../images/footer/Apparel.jpg) no-repeat
}
.BreweryTour {
    background: url(../images/footer/BreweryTour_Footer.jpg) no-repeat
}
.MedfordRum {
    background: url(../images/footer/MedfordRum_Footer.jpg) repeat
}
.Firepuncher {
    background: url(../images/footer/Firepuncher_Footer.jpg) repeat
}
.AboutBack {
    background: url(../images/About_Footer.jpg) no-repeat
}
.WireWorksMartini {
    background: url(../images/footer/WireWorksMartini_Footer.jpg) no-repeat
}
.HankyPanky {
    background: url(../images/footer/HankyPanky_Footer.jpg) no-repeat
}
#FooterRight {
    z-index: 1;
    right: 0px;
    width: 400px;
    height: 500px;
    padding: 0px 30px;
    overflow: hidden;
    background: url(../images/Menu_Back.jpg);
}
#FooterRight p {
    line-height: 20px;
    line-height: 20px;
}
#FooterRight h1 {
    margin-top: 40px
}
.D_inline {
    display: inline
}
.right {
    float: right
}
#twitter_div {
    height: 200px;
    width: 220px;
    overflow: visible;
    border: 1px solid #221b5e;
    border-radius: 5px;
    padding: 12px;
}
.TwitterFont {
    font-size: 16px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dotted #fff;
}
.TwitterFont a {
    color: #be6045
}
.Facebook iframe {
    border: none;
    height: 60px;
}
.Distilled {
    display: inline-block;
    width: 340px;
    padding: 40px 20px 0 0;
    vertical-align: top;
}
.Distilled2 {
    display: inline-block;
    width: 340px;
    padding: 40px 20px 0 0;
    vertical-align: top;
}
.DistilledMed {
    display: inline-block;
    width: 550px;
    padding: 40px 20px 0 0;
    vertical-align: top;
}
.DistilledBig {
    display: inline-block;
    width: 650px;
    padding: 40px 20px 0 0;
    vertical-align: top;
}
.DistilledBig p {
    padding-right: 20px;
    line-height: 150%;
    text-align: justify;
}
.Distilled h1 {
    font-size: 60px;
    color: #231f20;
    line-height: 60px;
}
.Distilled2 h1 {
    font-size: 60px;
    color: #231f20;
    line-height: 60px;
}
.Distilled2 h3 {
    padding-right: 20px;
    color: #111;
    font-size: 16px;
    text-align: center;
}
.DistilledMed h1 {
    font-size: 60px;
    color: #ae1414;
    line-height: 60px;
}
.DistilledMed h3 {
    padding-right: 20px;
    color: #111;
    font-size: 16px;
    text-align: justify;
}
.Distilled p {
    padding-right: 20px;
    line-height: 150%;
    text-align: justify;
}
.Distilled2 p {
    padding-right: 20px;
    line-height: 150%;
    text-align: justify;
}
.DistilledMed p {
    padding-right: 20px;
    line-height: 150%;
    text-align: left;
}
.FooterFeatureCopy h1 {
    line-height: 50px
}
.Photos {
    display: inline-block;
    width: 640px;
    padding: 40px 20px 0 0;
    vertical-align: top;
}












.dropdowns{float:left;width:690px;padding:0 0 10px;border-bottom:2px solid #d7d3c6}
.dropdowns a{float:left;width:190px;padding:5px 12px;color:#000;, georgia, serif;font-size:16px;background:#cdc1ab url("/assets/global/dropdown-bg.png") 190px 8px no-repeat;line-height:16px;text-decoration:none;margin-right:10px}

.pagination{margin-top:1em;clear:both}.pagination span{float:left;display:block;margin-right:5px}.pagination .page{padding-top:2px}.pagination a{color:#706B61;text-decoration:none}.pagination .current,.pagination a:hover{color:#386388;text-decoration:underline}.pagination .first,.pagination .last{display:none}.pagination .prev a,.pagination .next a{display:block;text-indent:-9999em;overflow:hidden;width:22px;height:22px;float:left}.pagination .prev a{background:url(/assets/pagination-left.gif) no-repeat}.pagination .next a{background:url(/assets/pagination-right.gif) no-repeat}.sitemap-col{float:left;width:250px}.sitemap-content ul{list-style:none}.navWrap{z-index:1000}



.flexslider .flex-control-nav{position:fixed;left:40px;bottom:20px;text-align:left;width:auto}
.flexslider .non_sticky{position:absolute; bottom:40px}
.flexslider .flex-control-nav li{margin-left:7px}
.flexslider .flex-control-nav li a{width:10px;height:9px;background:url("../images/footer-carousel-nav.png") 0 -9px no-repeat; }
.flexslider .flex-control-nav li a:hover,.flexslider .flex-control-nav li a.active{background-position:0 0}

.flexOverlay{height:120px;width:500px;position:absolute;top:200px;left:75px;}
.flexOverlay p{margin-top:0; color:#fff; padding:20px; width:280px; background:rgba(35, 31, 32, .8); }
.flexOverlay h1 {font-size:55px; line-height:50px; text-shadow:1px 1px 4px #333; margin:0; color:#f0f0f0;}
.flexOverlay h1 a{color:rgba(235, 205, 200,.9); font-family: 'Open Sans Condensed', sans-serif; text-transform:uppercase; }
.flexOverlay h1 a:hover{color:rgba(190, 96, 69, .9)}



.flex-container a:active,.flexslider a:active{outline:none}
.slides,.flex-control-nav,.flex-direction-nav{margin:0;padding:0;list-style:none}
.flexslider{width:100%;margin:0;padding:0}
.flexslider .slides > li{display:none}
.flexslider .slides img{max-width:100%; min-height:550px; display:block}
.flex-pauseplay span{text-transform:capitalize}
.slides:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
html[xmlns] .slides{display:block}
* html .slides{height:1%}
.no-js .slides > li:first-child{display:block}
.flexslider{position:relative;border-bottom:0;zoom:1}
.flexslider .slides{zoom:1}
.flexslider .slides > li{position:relative}
.flex-container{zoom:1;position:relative}
.flex-caption{background:none; zoom:1}
.flex-caption{width:96%; padding:2%; position:absolute; left:0;bottom:0;background:rgba(0,0,0,0.3);color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,0.3);font-size:14px; line-height:18px}
.flex-direction-nav li a{width:52px;height:52px;margin:-13px 0 0;display:block;background:url(/assets/flexslider/theme/bg_direction_nav.png) no-repeat 0 0;position:absolute;top:50%;cursor:pointer;text-indent:-9999px}
.flex-direction-nav li .next{background-position:-52px 0;right:-21px}
.flex-direction-nav li .prev{left:-20px}
.flex-direction-nav li .disabled{opacity:.3;filter:alpha(opacity=30);cursor:default}
.flex-control-nav{width:100%;position:absolute;bottom:-30px;text-align:center}
.flex-control-nav li{margin:0 0 0 5px;display:inline-block;zoom:1;*display:inline}
.flex-control-nav li:first-child{margin:0}
.flex-control-nav li a{width:13px;height:13px;display:block;background:url(/assets/flexslider/theme/bg_control_nav.png) no-repeat 0 0;cursor:pointer;text-indent:-9999px}.flex-control-nav li a:hover{background-position:0 -13px}
.flex-control-nav li a.active{background-position:0 -26px;cursor:default}

a{text-decoration:none; font-family:"Times New Roman", Times, serif; text-transform:uppercase}
p{color:#181818; line-height:30px; }
ul, li, ul li {text-align:left}

Answer 1

IE doesn't support %, or has great difficulty in doing so. Change you code to px a