Inspiring

Answered

Header logo issue in Explorer

Forum|Forum|8 years ago
November 10, 2017
2 replies
1281 views

Hi all,

Attached is a screenshot of what I'm seeing when running a browser check. It is dropping out of the header bar in Explorer. This is the code used fir the header bar/logo as well as a live link.

DIV:

</div>

LOGO CSS:

.hero .logo{text-align:center;padding:25px;padding-bottom:50px;background-color: #003b49}.hero .logo img{max-width:250px;float:left;padding-left:30px;margin-top:-10px}

LIVE LINK:

dc advocacy - premier inc.

Thanks for your help.

This topic has been closed for replies.

Correct answer osgood_

Hi osgood,

I pasted the css code in the header and moved the div above "row hero" and I'm seeing the same. Since the css for the logo is on the page it overrides an external style right?

I had to create a new link.

This is the page with the revised code.

capital analytics trial

I think you may be seeing a cached version of the page in the browser.

Try naming the logo <div> to something else like 'corporate_logo' (see below) as there may be some css still associated with the logo selector in your stylesheet causing the issue.

</div>

Then obviously rename the css selectors:

<style>

.corporate_logo {
padding: 15px 40px;
background-color: #003B49;
}
.corporate_logo img {
width: 270px;
}
.blue {
background-color: transparent;
}

</style>

Nancy OShea

Community Expert

I don't see your screenshot. I don't understand what is meant by dropping out of the header bar.

This is what I'm seeing in MS Edge and IE 11 at 100% Zoom.

Nancy O'Shea— Product User & Community Expert

kineticcreative123Author

Inspiring

Hi Nancy,

This is what explorer was doing.

O

osgood_

Legend

kineticcreative123 wrote
Hi all,
Attached is a screenshot of what I'm seeing when running a browser check. It is dropping out of the header bar in Explorer. This is the code used fir the header bar/logo as well as a live link.
DIV:
<div class="logo">
<img src="http://offers.premierinc.com/rs/381-NBB-525/images/16389_pinc-logo-white.svg" alt="" />
</div>
LOGO CSS:
.hero .logo{text-align:center;padding:25px;padding-bottom:50px;background-color: #003b49}.hero .logo img{max-width:250px;float:left;padding-left:30px;margin-top:-10px}
LIVE LINK:
dc advocacy - premier inc.
Thanks for your help.

I would say you don't need to use:

float: left;

as there seems no logical reason to do so, being as though the logo is in a <div> on its own.

If you want to keep float: left; then you would need to add:

overflow: hidden;

to the 'logo' css

kineticcreative123Author

Inspiring

Thanks osgood. It seems to just be centering now.

instead of this:

This is explorer:

Nancy OShea

Community Expert

That's not what I'm seeing.

Are you using IE in Compatibility Mode which is almost like viewing web pages in legacy IE7?

Turn it off. And add the following meta tag to your <head>

<meta http-equiv="X-UA-Compatible" content="IE=edge">

Nancy O'Shea— Product User & Community Expert

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded