Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.
One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.
Solved
CSS z-index quandary
Posted on 2014-11-29
Hello,
I have a client website https://www.seleneriverpress.com
Currently, on the home page only, the logo that appears in the upper left corner, disappears after the slideshow (?) loads as if I have a layering problem. This started happening when I messed with the z-index of the tiny shopping cart widget at the upper right corner. However on every other page of the site, everything works correctly in the right layers. Only the home page doesn't like what did, but I can't seem to find a remedy that will leave the other layers intact. Anything I've tried is then dropping the cart under the menu when you expand the cart box.
Any ideas what is going on? I know the css on this site is a mess. So much for Rockettheme/Joomla templates, but I'm so close to having it all working correctly, I'd really appreciate any suggestion to get that logo to pop above all other layers.
Thanks
Bill
I have a client website https://www.seleneriverpress.com
Currently, on the home page only, the logo that appears in the upper left corner, disappears after the slideshow (?) loads as if I have a layering problem. This started happening when I messed with the z-index of the tiny shopping cart widget at the upper right corner. However on every other page of the site, everything works correctly in the right layers. Only the home page doesn't like what did, but I can't seem to find a remedy that will leave the other layers intact. Anything I've tried is then dropping the cart under the menu when you expand the cart box.
Any ideas what is going on? I know the css on this site is a mess. So much for Rockettheme/Joomla templates, but I'm so close to having it all working correctly, I'd really appreciate any suggestion to get that logo to pop above all other layers.
Thanks
Bill
[X]
Welcome to Experts Exchange
Add your voice to the tech community where 5M+ people just like you are talking about what matters.
- Help others & share knowledge
- Earn cash & points
- Learn & ask questions
2 Comments
The page is so badly broken that it is virtually impossible to determine what rules are actually being applied to a given element.
The page does not come close to validating. The HTML validator reports 78 errors and most of the errors are serious structure problems that leave the page about as stable as quicksand.
I suspect the problem is not actually with the CSS, but the broken structure that leaves the parser in the browser guessing what the actual element hierarchy is supposed to be. Combine that with the excessive scripting and incomprehensible CSS and trying to do meaningful diagnostics is impossible because the Document Object is scrambled and the hooks could be anywhere.
I suggest you start by cleaning up the markup so it is valid and that may solve the problem, if it is a simple inability if the parser to understand structure through the errors. If that does not work then the problem will almost certainly be caused by one of the scripts applying and incorrect class or inserting content that overrides the correct cascade. The best way to find which script is at fault is to disable one at a time to see which one not running solves the problem, then go through that code and find the offending line of code that you will need to change.
Cd&
The page does not come close to validating. The HTML validator reports 78 errors and most of the errors are serious structure problems that leave the page about as stable as quicksand.
I suspect the problem is not actually with the CSS, but the broken structure that leaves the parser in the browser guessing what the actual element hierarchy is supposed to be. Combine that with the excessive scripting and incomprehensible CSS and trying to do meaningful diagnostics is impossible because the Document Object is scrambled and the hooks could be anywhere.
I suggest you start by cleaning up the markup so it is valid and that may solve the problem, if it is a simple inability if the parser to understand structure through the errors. If that does not work then the problem will almost certainly be caused by one of the scripts applying and incorrect class or inserting content that overrides the correct cascade. The best way to find which script is at fault is to disable one at a time to see which one not running solves the problem, then go through that code and find the offending line of code that you will need to change.
Cd&
Active today
Cd& is right on target. Before you address anything else, clean up the coding with the validator. Then let's take a look at it. In cleaning up the code, you may find other errors or that could be the fix. When you are relying on jquery/javascript it can get messed up or not even work when things are not valid.
As example, the slider has the code
When I looked at the theme http://demo.rockettheme.com/live/joomla/cerulean/, it has a couple of minor errors to start, but not the same that your client's page is showing.
Some of these themes tend to use <h> tags for styling. For SEO, you want to make sure that is not the case. The coding semantics of your page should read like a highschool term paper. A main topic sentence (the h1 tag) and several supporting sub topic sentences (h2) tags that each have some paragraphs(p tags) of content. Inside of an h2 tag, you can have an h3 tag, but you wouldn't want to have an h3 tag at the same level as an h2 tag.
As example, the slider has the code
… disease isn’t <br />germs, genes, or toxins.<h3>It's malnutrition.</h3></span>
… disease isn’t <br />germs, genes, or toxins.</span><h3>It's malnutrition.</h3>
When I looked at the theme http://demo.rockettheme.com/live/joomla/cerulean/, it has a couple of minor errors to start, but not the same that your client's page is showing.
Some of these themes tend to use <h> tags for styling. For SEO, you want to make sure that is not the case. The coding semantics of your page should read like a highschool term paper. A main topic sentence (the h1 tag) and several supporting sub topic sentences (h2) tags that each have some paragraphs(p tags) of content. Inside of an h2 tag, you can have an h3 tag, but you wouldn't want to have an h3 tag at the same level as an h2 tag.
<h1>Dogs Rule</h1>
<h2>Unconditional Love</h2>
<p>blah blah blah blah</p>
<p>blah blah blah blah</p>
<p>blah blah blah blah</p>
<h2>Protection</h2>
<p>blah blah blah blah</p>
<p>blah blah blah blah</p>
<p>blah blah blah blah</p>
<h2>No Liter Box</h2>
<p>blah blah blah blah</p>
<p>blah blah blah blah</p>
<p>blah blah blah blah</p>
Featured Post
Question has a verified solution.
If you are experiencing a similar issue, please ask a related question
This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight!
There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this Micro Tutorial viewers will learn how to create a CSS image sprite
(In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite)
Open a new Photoshop document with a width of (Icon width)x(N…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS
Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
Suggested Courses
Course of the Month7 days, 12 hours left to enroll
715 members asked questions and received personalized solutions in the past 7 days.
Join the community of 500,000 technology professionals and ask your questions.