Solved

Safari CSS problem

Posted on 2013-06-21
7
503 Views
Last Modified: 2013-07-04
Hello,

I have a Joomla site nearing completion but I just noticed in Safari that my top menu mouse over seems to be misaligned, as I can't mouse down to the sub menu that pops up. IE, FF, Opera, Chrome all seem fine, but Safari can't keep the submenu persistent. Anyone have any idea why? Or how to fix in Safari?

Thanks

http://www.coloradoweb3.com

Bill
0
Comment
Question by:billium99
  • 3
  • 2
  • 2
7 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39266000
You need to start by validating the page and cleaning up the structural errors.  Putting block element inside of inline elements will cause unpredictable rendering in modern browsers.

cleaning it up might solve the problem, if not we can dig further into it, but safari is very picky about markup being valid.

Cd&
0
 
LVL 1

Author Comment

by:billium99
ID: 39266440
Hmm - I'm not strong in CSS - validator barfs up all kinds of errors related to this template being responsive. Outside of that, I'm not sure where to focus. I appreciate clean markup, but I'm under the gun to resolve this browser-specific problem with the menu bar. Anyone have a guess where to focus?

Thank you
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39267283
I'm under the gun to resolve this browser-specific problem with the menu bar

Allthe more reason to clean up the code so change will reflect correct and you can see what you are doing instead of stumbling around in a foggy mine field.  Even if you find some kind of patch or hack; the state of the page will leave you without any guarantee that it won't get broken with the next release of any browser; or that it won't crumble with the next change you do.
0
Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

 
LVL 1

Author Comment

by:billium99
ID: 39267332
So your advice is: "Learn CSS. Fix your problem yourself."


Any other experts willing to target my menu problem?
0
 
LVL 6

Expert Comment

by:lightspeedvt
ID: 39279857
Those bug had appeared once you modified the theme?

For example, I am checking theme at:
http://demo.rockettheme.com/?template=cerulean
and it works properly under Safari. So, check the theme that you bought and find out if it already had bug. If yes - you need to re-download the theme and update all js/css files connected with navigation menu.
0
 
LVL 1

Author Comment

by:billium99
ID: 39284815
Thanks Lightspeed - in fact I did do this already. Their demo is not using the latest version of Joomla or the latest version of their own rocksprocket code, etc. Rockettheme has acknowledged this problem, but they did that in February, and still no solution in sight. I'm told it works OK in Safari 6 (Which I don't have since they didn't make a Windows version of it) and I think Rockettheme has moved this to the backburner. They continually release updates to many templates, but this fix never makes it in.

That's when I came to the Experts!

Any ideas what Rockettheme will eventually need to do to address this?

=)

Bill
0
 
LVL 6

Accepted Solution

by:
lightspeedvt earned 500 total points
ID: 39284969
So, as I understood - you had tested the initial source version that you bought and it already had a bug. Coming from their demo - they don't have bug inside the release at demo. Version of Joomla can't influence onto those bug. So, the most first thing is to take the CSS code of navigation menu from their demo and place it to the initial source version that you have from them.

Download: http://demo.rockettheme.com/joomla/cerulean/templates/rt_cerulean/css-compiled/menu-702cb8d6b3129d7ba782074cc09075f8.css

And place it to source. After that test it under safari to see if bug issue is solved.
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now