Joomla Templates Club 406,261 posts

[nicely Friend nicelyJoin date: July 2008Posts: 66Downloads:51Uploads:6 Thanks: 24 Thanked: 1 times in 1 posts]

#172489

I have an issue with logo and top menu alignment in IE9 which isn’t present in any other browsers (surprise, surprise). If I activate Compatibility View, the issue is sorted. However, this is not ideal and I’d prefer to have it correct by default.

Here’s the site.

[pixelzombie Friend pixelzombieJoin date: August 2010Posts: 339Downloads:2Uploads:49 Thanks: 32 Thanked: 168 times in 107 posts]

#432769

Hi nicely,

try to add this to your template.css this:

#ja-header {
width: 100% !important;
}

I Hope it works. Looks promising here 🙂

1 user says Thank You to pixelzombie for this useful post

1. nicely

[nicely Friend nicelyJoin date: July 2008Posts: 66Downloads:51Uploads:6 Thanks: 24 Thanked: 1 times in 1 posts]

#432771

Thanks for that pixelzombie. It’s fixed the top image but not the menu…

[pixelzombie Friend pixelzombieJoin date: August 2010Posts: 339Downloads:2Uploads:49 Thanks: 32 Thanked: 168 times in 107 posts]

#432774

I guess you mean that the menu breaks the last menu item into a new row right? Your menu is rendered a little different in IE, it’s just too long. Try this (if you can live with it)

Edit ja.moomenu.css (from line 89)

#ja-cssmenu li a {
color: #333333;
display: block;
font-variant: small-caps;
letter-spacing: 1px;
padding: 8px 19px;
text-decoration: none;
}

It’s just 2px, but it’s enough for the IE.

1 user says Thank You to pixelzombie for this useful post

1. nicely

[nicely Friend nicelyJoin date: July 2008Posts: 66Downloads:51Uploads:6 Thanks: 24 Thanked: 1 times in 1 posts]

#432777

That’s much better, thanks 🙂 It adds a line space under the menu (just in IE); is that the part I have to live with?

[pixelzombie Friend pixelzombieJoin date: August 2010Posts: 339Downloads:2Uploads:49 Thanks: 32 Thanked: 168 times in 107 posts]

#432780

Hmm, of course not, but I didn’t found the reason why it’s that high in IE. Well, you could try to use a vendor specific css statement (only for IE) like this:


#ja-mainnav {
-ms-height: 33px;
}


Or define the height of #ja-mainnav in the IE specific css file. I cannot test this right now but that should do it 🙂

[nicely Friend nicelyJoin date: July 2008Posts: 66Downloads:51Uploads:6 Thanks: 24 Thanked: 1 times in 1 posts]

#432787

Neither of those made any difference. I’m not too bothered though, as I doubt anyone will notice except me. 🙂

[pixelzombie Friend pixelzombieJoin date: August 2010Posts: 339Downloads:2Uploads:49 Thanks: 32 Thanked: 168 times in 107 posts]

#432788

I noticed 😉
Try to add !important behind the width.

#ja-mainnav {
-ms-height: 33px !important;
}

or

#ja-mainnav {
height: 33px !important;
}

1 user says Thank You to pixelzombie for this useful post

1. nicely

[nicely Friend nicelyJoin date: July 2008Posts: 66Downloads:51Uploads:6 Thanks: 24 Thanked: 1 times in 1 posts]

#432796

Sorted 🙂 The first didn’t work but the second did.

Thanks for your help!

[Author]

Posts