[keeganlanierParticipant]

I have successfully recreated what I am trying to accomplish via help from this forum almost perfectly. If you view http://www.walkonsfranchising.com via chrome or safari everything appears correctly. As usual, internet explorer is a thorn in my side. Do any of you all know a workaround to raise the revolution slider to the top of the page specifically in internet explorer without changing the custom code I have in place that is working perfectly in other browsers?

[ZeshanMember]

Hi there,

Thanks for writing in!

Your code might not work in Internet Explorer as you are changing the height of .masthead to 0px. Instead you can try using this code:

@media (min-width : 980px) {
  .masthead {
    margin-bottom: -97px;
  }
}

Hope this helps. 🙂

Thank you.

[keeganlanierParticipant]

unfortunately that didn’t make any changes. below is my current custom code. I am using the renew stack. Everything looks great in safari and chrome, but internet explorer is displaying the slider revolution lower than it should and in firefox it is shifting the slider revolution over to the right.

@media (min-width : 980px) {
  .masthead {
    margin-bottom: -97px;
  }
}

@media (max-width: 979px) {
  .site,
  .x-navbar.x-navbar-fixed-top.x-container-fluid.max.width {
    width: 100%;
  }
}

	.x-slider-revolution-container.below {
		position: absolute;
		z-index: 0;
                margin: -97px 0px -97px 0px;
             padding-bottom:40px;
	}

.desktop .mobile .x-nav .x-megamenu>.sub-menu a,.x-navbar  .site .sub-menu li > a {
 color:#000000;
 background-color:transparent;
 font-size: 16px;
 font-weight:bold;
 padding:0px;
}

.x-navbar {
    background-color: transparent!important;
   font-size:16px;
   font-weight:bold;
   padding:0px;
}

@media (max-width: 1100px) {
    .x-navbar .x-nav>li>a {
	letter-spacing: 0px;
       padding: 10px 5px 0;
    }
}

.x-navbar .desktop .x-nav > li > a:hover > span, 
.x-navbar .desktop .x-nav > li.x-active > a > span, 
.x-navbar .desktop .x-nav > li.current-menu-item > a > span {
    box-shadow: none;
}

body .site {
  background-color: #000000;
}

.widget ul li, .widget ol li {
background-color: transparent !important;
}

footer.x-colophon.top {
    background-color: #16365e;
    color: #ffffff!;
}

footer.x-colophon.top .widget a, footer.x-colophon.top .widget li , footer.x-colophon.top h4.h-widget {
    color: #ffffff;
    background-color:transparent;
}

footer.x-colophon.top .widget a:hover {
    color:#ff0000;
}

.h-custom-headline.accent span:before, 
.h-custom-headline.accent span:after {
     border-top: 1px solid #333333;
     border-bottom: 1px solid #333333;
}

[FriechModerator]

Hi There,

Please remove all your custom CSS with something to do with positioning the slider behind the navbar and add this instead:

.x-slider-container.below {
    margin-top: -97px;
}
.x-navbar {
	background-color: rgba(0,0,0,0) !important;
}

Hope it helps, Cheers!

[keeganlanierParticipant]

I greatly appreciate your assistance. That didn’t quite do the trick either so I played around a little more with positioning settings and got it all figured out. I had to sacrifice a little of my image space, but I am quite alright with that. Below is the adjusted custom CSS for my site.

.x-slider-container.below {
    position:relative;
    top:-97px;
    left:0px;
    margin-top:0px;
    margin-bottom:-97px;
}
.x-navbar {
	background-color: rgba(0,0,0,0) !important;
}

body .site {
  background-color: #000000;
}

footer.x-colophon.top {
    background-color: #16365e;
    color: #ffffff!;
}

footer.x-colophon.top .widget a, footer.x-colophon.top .widget li , footer.x-colophon.top h4.h-widget {
    color: #ffffff;
    background-color:transparent;
}

footer.x-colophon.top .widget a:hover {
    color:#ff0000;
}

.h-custom-headline.accent span:before, 
.h-custom-headline.accent span:after {
     border-top: 1px solid #333333;
     border-bottom: 1px solid #333333;
}

[John EzraMember]

Hi there,

Thanks for updating the thread and glad you found a way around it. Let us know if there is anything else – thanks!

[Author]

Posts